浏览器兼容问题:今天打开网页发现在IE中居中正常,在FireFox中整个也面都靠在左边了。打开代码,发现是table结构,只做了个table居中。加上div align=“center”之后FF中是正常了,但是IE中表格里面文字也居中了。然后想到固定宽度,让左右外边距都自动,试了下,果然好使。顺手记下
6 a; I* g$ O9 G
* h& E& U" k; [! Z1 O4 K2 y9 @5 i一、IE浏览器中设置div或table为水平居中:
- d2 T$ F& {: t! @' T8 T: V8 i ' d1 d9 ] ~; c& s3 h; k
IE中在body中加入text-align:center,即可实现布局居中。 body{text-align:center}
* }% r5 H2 D6 Z' O1 m- l! I + y0 h9 w4 c+ |3 t5 ~
二、FIREFOX浏览器 层或table水平居中:
5 b* j2 K/ F6 S' M; Q' I #mydiv{margin-left:auto;margin-right:auto} <div id="mydiv"> </div>
. x* t+ [8 ]3 P! a7 H或者 .mydiv{width:900px;margin-left:auto;margin-right:auto} <div class="mydiv"> </div> ( L1 e3 M7 a& X, A
或者 <div style="width:900px;margin:auto;text-align:left"> </div> 5 t( Z( _0 w; ?5 k k- M' C
, W8 C5 p" L4 }3 m6 T+ R
三、因此,想要让DIV或table在IE浏览器和FIREFOX浏览器都水平居中,需要采取两种设置方法 0 _$ a) n3 M$ |5 x
body{text-align:center} .mydiv{width:900px;margin-left:auto;margin-right:auto} <div class="mydiv"> </div>
|