liで横並びをfloatしないでdisplay: inline-block;をul下に余白マージンがつけられて便利。

CSS

↓元記事
【CSS】ul,olのリストを横並びにするときにfloatじゃなくてdisplay:inline-blockを使う方法
http://delaymania.com/201404/web/list-inline-block/


いままでliをfloatしてリストつくっちゃうとulに高さがつかなくて
リスト表示のしたのmarginやらpaddingの設定に苦労してたんだけど、
なるほどこの方法なら楽だなー。

ul {
font-size: 0;
}
li {
background-color: #222222;
display: inline-block;
font-size: 12px;
width: 25%;
}

font-sizeをちょいちょいしないといけないけど。