HTML/CSS のどんな質問にも優しく答えるｽﾚ 52 (858ﾚｽ)
上下前次1-新
抽出解除 ﾚｽ栞
498(1): 05/21(火)08:39 ID:??? AAS
「box-sizing: border-boxが効いていない」と思うのであれば、なにか認識が食い違っているのではなかろうか
box-sizingとheight: autoに対する自分の認識はこう
box-sizing: border-box;
height: auto;
border: 10px solid red;
こうスタイルを指定した要素は「子要素がボーダーの内側に収まる」ようになるので
計算済みのheightは「子要素によって計算される高さ+20px(上下のボーダー)」
になる
box-sizing: content-boxにすると「子要素がボーダーの内側に収まる」のは変わらないけど「ボーダーが高さの計算に入らなくなる」のでその分小さくなる
505: 05/21(火)15:28 ID:??? AAS
>>498-499
横からだけど、なるほど分からん、と一瞬思ったが
height:autoだと、content-boxでもborder-boxと同じく「ボーダーの内側に収まる」という前提でheightが計算されているから
content-boxのコンテンツ領域の数値はborder-boxの数値と同じになるって考えたら理解できた（何言ってるのか分かりにくいとは思うが）
というか開発者ツールでマウスオーバーで表示されるフローティングボックスだけ見ちゃってて、計算済みタブの方でheightに差が出てるの見落としてたわ
解説ありがとう、勉強になりました
上下前次1-新書関写板覧索設栞歴
ｽﾚ情報 赤ﾚｽ抽出 画像ﾚｽ抽出 歴の未読ｽﾚ AAｻﾑﾈｲﾙ
ぬこの手 ぬこTOP 1.150s*