不定宽度的水平居中

» 2010-2-28 20:24:55 已被归档于 Html/Css
不定宽度的水平居中
通常我们的居中方式
.box{width:200px;margin:0 auto;}

但是在没有固宽的情况下.居中就麻烦了
不过可以这样写,用relative;


当然也可以用JS
同理垂直居中也可以用这偏移减半的方法:


另外对支持display:table;的游览器(包括IE8和!IE).可以这样居中
利用table的居中方式


比较下:
<div style="display:table; height:100px; background-color:#999;">
<div style="display:table-cell; vertical-align:middle;">
<div>111我是DIV</div>
</div>
</div>
</div>
<table width="100%" border="0" cellspacing="0" cellpadding="0" style="height:100px; background:#060;">
<tr>
<td>222我是table</td>
</tr>
</table>

是不是很像.

相关评论(共1条)

jim