「なんとなく」で使っていませんか? CSSではいろいろな「単位」でサイズや余白を指定できます。それぞれの単位の違いを理解して使えれば、「なぜかずれる」といったトラブルも防げます。 CSSには、margin、padding、line-height、font-sizeといったさまざまなプロパティがあります。プロパティでは異なる用途に対応するために長さを指定する単位がたくさんあります。問題は、CSSプロパティに別の単位で同じ値を設定しても、実際に表示される大きさが異なりうまくいかないことあることです。たとえば要素のwidthプロパティやheightプロパティの設定でビューポートの幅や高さを基準にすると、使える単位はvh、vw、vmin、vmaxだけです。 この記事では「長さの単位」と、フォントサイズに適用したときの影響を解説します。 ピクセル単位(px) ピクセルはサイズを固定する単位です。1ピ
![CSS初心者が混乱しがちな7つの単位の意味と違いをしっかり理解しよう](https://cdn-ak-scissors.b.st-hatena.com/image/square/b5cf6bc0cf4e7edd6c19a2348c9d3a4ebf6e67e6/height=288;version=1;width=512/https%3A%2F%2Fascii.jp%2Fimg%2F2022%2F07%2F27%2F2444510%2Fl%2Fcf9eb7350b110f10.jpg)