浏览器兼容问题:今天打开网页发现在IE中居中正常,在FireFox中整个也面都靠在左边了。打开代码,发现是table结构,只做了个table居中。加上div align=“center”之后FF中是正常了,但是IE中表格里面文字也居中了。然后想到固定宽度,让左右外边距都自动,试了下,果然好使。顺手记下 - o+ D @* t$ r' e
9 k, G* _0 B& f9 v: d- M
一、IE浏览器中设置div或table为水平居中: 0 f) n! A2 u3 ^) k& U, i, ]+ L& s
7 G& A0 U. v9 P2 jIE中在body中加入text-align:center,即可实现布局居中。 body{text-align:center} ; V! v2 P1 ~* M! {
- \* r' |4 |) ?" P" v4 {" Z& W二、FIREFOX浏览器 层或table水平居中: T- K; Q2 c0 `( r
#mydiv{margin-left:auto;margin-right:auto} <div id="mydiv"> </div>
7 ~- f5 H3 \6 y8 x! K k# w6 @8 |或者 .mydiv{width:900px;margin-left:auto;margin-right:auto} <div class="mydiv"> </div> + A- ]3 h" `& L
或者 <div style="width:900px;margin:auto;text-align:left"> </div> 5 T1 t! |1 I( a, d' h
& H% Q: u! C% W, `0 \8 y) h( f, [
三、因此,想要让DIV或table在IE浏览器和FIREFOX浏览器都水平居中,需要采取两种设置方法 $ t, o$ n6 Y/ u* z0 y0 f- w. X
body{text-align:center} .mydiv{width:900px;margin-left:auto;margin-right:auto} <div class="mydiv"> </div>
|