|
浏览器兼容问题:今天打开网页发现在IE中居中正常,在FireFox中整个也面都靠在左边了。打开代码,发现是table结构,只做了个table居中。加上div align=“center”之后FF中是正常了,但是IE中表格里面文字也居中了。然后想到固定宽度,让左右外边距都自动,试了下,果然好使。顺手记下
5 x/ }) n t3 Q7 A5 A3 [+ z1 J
+ |7 C3 ~2 n0 P0 T- K一、IE浏览器中设置div或table为水平居中:
6 V) W% Z9 V: ?" P6 [% p : w. K2 R# k: N/ _, ?: i0 ]
IE中在body中加入text-align:center,即可实现布局居中。 body{text-align:center} ( a4 m8 g0 D1 ~/ `& s
. a5 S' n6 l& j3 i+ V, h& Z. p+ F! }二、FIREFOX浏览器 层或table水平居中: 1 j! l! }* K: e. E
#mydiv{margin-left:auto;margin-right:auto} <div id="mydiv"> </div> . T! t' t! J2 S
或者 .mydiv{width:900px;margin-left:auto;margin-right:auto} <div class="mydiv"> </div> * `/ X+ M% j7 E6 ^
或者 <div style="width:900px;margin:auto;text-align:left"> </div> # A* M5 r1 f/ b* }
: \+ y. G8 c; A1 b) f2 b
三、因此,想要让DIV或table在IE浏览器和FIREFOX浏览器都水平居中,需要采取两种设置方法
# n& E" I8 D4 f body{text-align:center} .mydiv{width:900px;margin-left:auto;margin-right:auto} <div class="mydiv"> </div>
|