浏览器兼容问题:今天打开网页发现在IE中居中正常,在FireFox中整个也面都靠在左边了。打开代码,发现是table结构,只做了个table居中。加上div align=“center”之后FF中是正常了,但是IE中表格里面文字也居中了。然后想到固定宽度,让左右外边距都自动,试了下,果然好使。顺手记下 j2 w: ~; L$ q( K' Q: q8 d& l
/ N: O" L5 N, j4 i一、IE浏览器中设置div或table为水平居中:
2 d5 m/ V; ~3 y2 A/ b1 s- R. K
$ X. n: M! X: ?7 U7 nIE中在body中加入text-align:center,即可实现布局居中。 body{text-align:center}
7 Y- K4 U+ t G0 {1 T) X) t . a" Z" U( u3 Q, [* C8 n6 D' ]
二、FIREFOX浏览器 层或table水平居中: + ?6 q) D' I1 T" s, E
#mydiv{margin-left:auto;margin-right:auto} <div id="mydiv"> </div>
% n6 o4 z. V- v+ Y3 r* F& r3 x或者 .mydiv{width:900px;margin-left:auto;margin-right:auto} <div class="mydiv"> </div> # F2 n6 a' k! a. L4 i
或者 <div style="width:900px;margin:auto;text-align:left"> </div> ! e! _& X" ~0 i( `
; C. s8 R3 j2 T! X* H/ M三、因此,想要让DIV或table在IE浏览器和FIREFOX浏览器都水平居中,需要采取两种设置方法 " ^7 S& `* d7 D/ K; B5 R5 l
body{text-align:center} .mydiv{width:900px;margin-left:auto;margin-right:auto} <div class="mydiv"> </div>
|