浏览器兼容问题:今天打开网页发现在IE中居中正常,在FireFox中整个也面都靠在左边了。打开代码,发现是table结构,只做了个table居中。加上div align=“center”之后FF中是正常了,但是IE中表格里面文字也居中了。然后想到固定宽度,让左右外边距都自动,试了下,果然好使。顺手记下 + A# b: C. x N5 {( e
" m% m8 E w" _9 f
一、IE浏览器中设置div或table为水平居中:
& B. Q) s! A9 W
7 k% k8 _ x7 l' n8 HIE中在body中加入text-align:center,即可实现布局居中。 body{text-align:center}
2 i& k5 b; X1 k, ^& \( X ; O1 t' B, f5 Q3 ~8 A3 Z1 {
二、FIREFOX浏览器 层或table水平居中:
" g$ u @7 K$ O #mydiv{margin-left:auto;margin-right:auto} <div id="mydiv"> </div>
: Z! |0 r8 t# q& k或者 .mydiv{width:900px;margin-left:auto;margin-right:auto} <div class="mydiv"> </div>
6 ?: e) b- e+ f! @1 M1 E% y; H6 B4 V或者 <div style="width:900px;margin:auto;text-align:left"> </div>
( p0 p5 w7 b1 a5 w 6 D- i+ Z# T* q9 }2 V
三、因此,想要让DIV或table在IE浏览器和FIREFOX浏览器都水平居中,需要采取两种设置方法 # g, @2 Q5 B& O+ H
body{text-align:center} .mydiv{width:900px;margin-left:auto;margin-right:auto} <div class="mydiv"> </div>
|