display:inline-block;で横並びの
リストが複数あって、そのブロック要素
- とかをセンターあわせにしたい場合って多いと思います。
- リストの幅が可変する場合、
たとえば、文字列などで、長さが変わる場合には、- の全体の幅も変わるので、widthが決められませんので、
margin: 0 auto;は使えません。なので、
じゃーん!!
display:inline-block;
の登場です!!!!!!!例:フッターリンクで普通はfloat:leftしたいところですが、
ulにtext-align:center;を効かせたいので、このようにすればOK!!!!!!#footer ul{ overflow:hidden; text-align:center; } #footer ul li{ display:inline-block; margin:0 5px; *display: inline; /* これをつけないとIE互換で横並びにならない */ *zoom: 1; /* これをつけないとIE互換で横並びにならない */ }
関連記事はこちら!
でも、
スポンサーリンク