よく直面するものの、いつも忘れているのでメモです。

<div style=”padding:10px;”>
<div style=”float:left;”>a</div>
<div style=”float:left;”>b</div>
<div style=”float:left;”>c</div>
<div style=”float:left;”>d</div>
</div>

と記述した場合、外枠のpaddingがfirefoxでは効きません。効くようにする為には、

<div style=”padding:10px;”>
<div style=”float:left;”>a</div>
<div style=”float:left;”>b</div>
<div style=”float:left;”>c</div>
<div style=”float:left;”>d</div>
<br style=”clear:both;”>
</div>

と、赤字のように、入れてやる必要があります。

 別の方法

cssに

.clearfix:after {
    clear: both;
    content: “”;
    display: block;
    height: 0;
}
と記述して、

<div style=”padding:10px;” class=”clearfix”>
<div style=”float:left;”>a</div>
<div style=”float:left;”>b</div>
<div style=”float:left;”>c</div>
<div style=”float:left;”>d</div>
</div>

でもOKです。

 

スポンサー

お問い合わせ

この記事についてご質問があれば、お問い合わせ下さい。

お名前(必須)
お名前フリガナ(必須)
メールアドレス(必須)
メールアドレス確認(必須)
お問い合わせ記事URL
お問い合わせ内容(必須)