floatを使った際に段組レイアウトで一番下まで背景が行かない件
どうも、今日はCSSについて語りますよー。
ちょっと今自分のサイトとは別のサイトをデザインしてるのですが、
floatを使ったときって、そのボックス要素の下まで背景色が行かないんですよね。
いつも一番上のfloatじゃなく直接載っけてる部分までしか背景色が適用されない。
つまりこんな感じ?
<body(bgcolor:brown)>
<container(bgcolor:white)>
<header>
</header>
<contents>
<left-contents:float>
</left-contents>
<right-contents:float>
</right-contents>
</contents>
</container>
そう、left-contentsとright-contentsの部分に背景ががが
で、ちょっと調べてみたんです。
そしたら、floatというものは「適用させる要素を上に浮かせる」ものらしいですね。
だから、containerで適用した背景色がfloatで浮かせたコンテンツ部分には適用されない、と。
これの解決策としてはいろいろあるみたいですけど、今日はもう疲れたのと学校の課題をやらなければいけないので、もうDWは閉じました。
今からProcessing開きます。。。
これ、重いんだよね。。。すげぇ重いんだよね。。。
平気でCPU使用量80%とか持ってくんだよね。。。
欝だ。。。
ちょっと今自分のサイトとは別のサイトをデザインしてるのですが、
floatを使ったときって、そのボックス要素の下まで背景色が行かないんですよね。
いつも一番上のfloatじゃなく直接載っけてる部分までしか背景色が適用されない。
つまりこんな感じ?
<body(bgcolor:brown)>
<container(bgcolor:white)>
<header>
</header>
<contents>
<left-contents:float>
</left-contents>
<right-contents:float>
</right-contents>
</contents>
</container>
そう、left-contentsとright-contentsの部分に背景ががが
で、ちょっと調べてみたんです。
そしたら、floatというものは「適用させる要素を上に浮かせる」ものらしいですね。
だから、containerで適用した背景色がfloatで浮かせたコンテンツ部分には適用されない、と。
これの解決策としてはいろいろあるみたいですけど、今日はもう疲れたのと学校の課題をやらなければいけないので、もうDWは閉じました。
今からProcessing開きます。。。
これ、重いんだよね。。。すげぇ重いんだよね。。。
平気でCPU使用量80%とか持ってくんだよね。。。
欝だ。。。