ホーム > ブログ
Recent Comments
Categories
- No categories
あるdiv要素を中央寄せにしようとして、ちょっと悩んだので忘れないようメモします。
<style> div#a { width:100%; text-align:center; } div#b { width:100px; border:1px solid #333; } </style> <div id="a"> <div id="b">text</div> </div>
これは、IEだと正しく中央寄せされるのに、Firefoxでは中央寄せされない。
なんでかな~と調べてみたら、FireFoxの場合は子要素の側でも、親要素の余白指定を使うかどうかをmarginで指定してあげないと思ったとおりの表示にならない。
そこで、styleタグの中に以下を追加する。
div#b {
width:100px;
border:1px solid #333;
margin-left:auto;
margin-right:auto;
}
これで期待通り中央寄せ表示される。
[2008/07/19]
Uncategorized
|
2 Comments »
2 Comments
Leave a comment
Comment by S.M. — 2012-04-03 @ 7:06 pm
Comment by skatsube — 2012-05-02 @ 11:12 am