2023-09-01から1ヶ月間の記事一覧
テキストによる、高さが変動する要素を2つ用意する。 下記のように、テキストが揃わない2つの要素がある場合、JavaScriptで計算して高さを揃える必要がある。 html <body> <div class="wrap"> <ul class="list list-1"> <li class="item-1">固定の要素</li> <li class="item-2"> 変動変動変動変動変動変動変動変動変動変動変動変動変動変動変動変動変動変</li></ul></div></body>…
下記のように--dynamic-heightをキーとして、スタイルを変更することができる。 .sample::before { height: var(--dynamic-height, 0%); } const elem = document.querySelector('.elem'); elem.style.setProperty('--dynamic-height', 100 + '%');