浏览器兼容问题:今天打开网页发现在IE中居中正常,在FireFox中整个也面都靠在左边了。打开代码,发现是table结构,只做了个table居中。加上div align=“center”之后FF中是正常了,但是IE中表格里面文字也居中了。然后想到固定宽度,让左右外边距都自动,试了下,果然好使。顺手记下 & I' D, n% t1 m# p+ |3 o+ z
$ M- W8 L" j. r! G一、IE浏览器中设置div或table为水平居中:
# _+ h" [% j% V
1 u$ M' Z; c `+ aIE中在body中加入text-align:center,即可实现布局居中。 body{text-align:center}
( W$ x4 D/ h0 z7 U0 Y7 f . ?1 V/ ?/ s2 Q, ^1 J8 D- M; q3 T. x
二、FIREFOX浏览器 层或table水平居中:
3 |" r$ W9 u; w; b8 T# _' Q. b7 g #mydiv{margin-left:auto;margin-right:auto} <div id="mydiv"> </div>
# X4 v+ `' u/ n, ~" L( ]& e或者 .mydiv{width:900px;margin-left:auto;margin-right:auto} <div class="mydiv"> </div> - \# @3 \6 c# R2 e% Y
或者 <div style="width:900px;margin:auto;text-align:left"> </div> ' q, p4 L8 f3 m0 {$ T, V
; i$ d5 P4 Q6 [5 f d6 y: R- R( w
三、因此,想要让DIV或table在IE浏览器和FIREFOX浏览器都水平居中,需要采取两种设置方法 / A/ Z) y& Y/ I* ^* r+ c
body{text-align:center} .mydiv{width:900px;margin-left:auto;margin-right:auto} <div class="mydiv"> </div>
|