CSSで il,ol をテーブルっぽくやるとき

別にいまさらなんだけど
SEOを気にしたらこうなりますっていうメモってことで。

全体を指定して

ul{
width:100%;
}

割合を指定するして横にならべる

li{
width:33%;
float:left;
}

で　使うときはこんな感じ。

<ul>
<li>ライン１のカラム１</li>
<li>ライン１のカラム２</li>
<br /> //行を変える
<li>ライン２のカラム１</li>
<li>ライン２のカラム２</li>
<br /> //行を変える
<li>ライン３のカラム１</li>
<li>ライン３のカラム２</li>
</ul>

table タグ使って中に li する人が増えてるけど
やっぱやるなら全部 list タグでってことで。

Tweet