IE6 下 margin:0 auto 不能居中的 bug 問題如何解決?

IE6下對block元素使用margin:0 auto 發現不能居中,搜了下發現兩種解決方案:

1、更改DOCTYPE為 xhtml 1.0 tranditional (html 4.01 下無效)

2、在塊外邊添加div,並對此div應用text-align:center

現在的情況是:

不能更改doctype為xhtml,也不想添加破壞語義性的外層div,有更好的解決方案嗎?

謝謝。


4.01下是有效的。 樓主是不是沒設置寬度。沒有寬度的話block元素當然就頂到兩頭了。如果外面有很多層其他容器的話,那可以採用絕對定位負補丁的方法,如@Housne所述,但前提是你的容器一樣得定寬


可以試試: margin-left:auto;margin-right:auto; 或者在父級元素上 text-align:center; 當前元素 text-align:left;


body {text-align:center; margin:0 auto;}


混雜模式下的IE6是不支持
margin:0 auto 的,標準模式下的IE6則支持
margin:0 auto 。

如果你不想更改doctype類型,可以像上面答案一樣設置body {text-align:center; margin:0 auto;}

然後再在想要居中的block元素{ text-align:left }


在DIV外面套一層 &< center &> &< /center &>


1.body{text-algin:center;}

2.

3.定位:left:50%;margin-left:-w/2;


整個網頁居中的話:

body {margin: 0 auto; width: 960px;}

內部元素居中的話:

&

&content&

&

.wrapper {text-align: center;}

.wrapper div {text-align: left;}

.content {width: 350px;}

END


是可以的呀,你先要外面用一個寬,只有要先定一個框,裡面的框架大,外面的小就只可以劇中了。&& style="width:960px;height:100%;margin:0 auto;"&&


試試給body或父元素添加text-align:center的樣式


可以嘗試下使用絕對定位到父級元素的一半, position:absolute;left:50%; 然後使用居中元素一半寬度的左負空白邊,例如居中元素寬度為 760px; margin-left:-360px;


塊級+寬度+margin:0 auto ,你用一個最簡單的頁面做一下居中,可能是其他因素影響了


我在修改一個.net項目的時候遇到過"因為有net的頭部聲明出現你這問題,本地無法居中,放到網上後net聲明起作用後就正常了,而且我是h5的聲明


你沒有貼代碼,你的沒有居中,我猜測你是沒有給div加寬度吧!


樓主搞錯了吧,設置塊狀元素左右margin值為auto時,在IE6中是可以實現居中的,我經常使用這種方式做居中塊狀元素的居中效果。


&< center &> &< /center &>


推薦閱讀:

如何通過CSS使得子控制項相對於父控制項居中?
關於css中hover的用法,如何編寫代碼才能完成下面的功能?還是說不能完成?
手機端網頁的頭部meta標籤裡面都應該配置些啥?
關於div+css布局的定位?

TAG:前端開發 | CSS | CSS布局 |