;

しんみゆ.com

群馬県高崎市在住の夫婦で日記というか、つぶやきブログしてます:しんみゆ.com

IEハックメモ:CSS のみで、table 要素のような上下中央揃えを実現するための方法

見た目は、こんな感じです。

aaaa
aaaa
aaaa
aaaa
aaaa
aaaa

以下、コード例)

【html】
<div class="sample1">
<div>
aaaa
</div>
<div>
aaaa<br />
aaaa
</div>
<div>
aaaa<br />
aaaa<br />
aaaa
</div>
</div>

【css】

div.sample1{ }

div.sample1 div{
display:table-cell;
width:100px;
margin-bottom:1px;
vertical-align:middle;
}

* html div.sample1 div{/* IE 6 */
display:inline;
zoom:1;
}

*:first-child+html div.sample1 div{/* IE 7 */
display:inline;
zoom:1;
}

%d人のブロガーが「いいね」をつけました。

ページトップ