需要將一個ul置於div ie6＆ie7中

Question

我有一個ul，我需要在div中居中。 我所擁有的代碼（你將在下面找到）可以在除了ie6和ie7之外的每個瀏覽器中工作，其中內容是向左浮動而不是居中。 我已經刪除了我的代碼到基礎知識。 我已經嘗試通過許多修復工作，但尚未成功，所以任何有關這方面的幫助將不勝感激。

//CSS
#galleryThumbs {
    width:900px;
    height:125px;
    text-align:center;
    margin:0px auto;
}
ul.thumb {
    margin:0;
    padding:0;
    list-style:none;
    display:inline-block;
}
ul.thumb li {
    width:65px;
    height:65px;
    margin:0 2px 0 2px;
    border:1px solid #ffffff;
    display:inline-block;
    float:left;
}

//HTML
<div id="galleryThumbs">
    <ul class="thumb">
        <li><img src="http://www.thewoom.co.uk/clients/lowdklea/work/01_thumb1.jpg"></li>
        <li><img src="http://www.thewoom.co.uk/clients/lowdklea/work/01_thumb2.jpg"></li>
        <li><img src="http://www.thewoom.co.uk/clients/lowdklea/work/01_thumb3.jpg"></li>
    </ul>
</div>

非常感謝Brendan

Answer 1

IE 6和IE 7不支持display:inline-block

您可以使用IE CSS hack來覆蓋inline-block元素

zoom: 1;
*display: inline;

我會把IE條件評論中包含的那些僅限於目標IE。

演示http://www.jsfiddle.net/gaby/qArVS/2

Answer 2

IE6 / 7不支持display: inline-block on elements默認display: block 。 另請參見Quirksmode.org：CSS2 - display聲明 ：

IE 6/7僅接受具有自然display: inline元素的值display: inline 。

默認情況下， <ul>是display: block ，所以這不起作用。

其中一個解決方案是給<ul>一個固定的寬度，以便它可以通過margin: 0 auto來居中。

Answer 3

沒有hacks for Internet Explorer 7的解決方案將添加到您的代碼中：

    #yourdiv {
            width: 100%;
            position: relative;
            text-align: center;
    }

            #yourdiv ul {
                    float: left;
                    position: relative;
                    left: 50%
                    text-align: center;
            }

                    #yourdiv ul li {
                            float: left;
                            position: relative;
                            display: block;
                            right: 50%;                
                    }

有了這個，您可以在Internet Explorer 7中將未排序的列表居中，而不會出現任何問題。

Answer 4

以上（我的意思是具有UL寬度聲明的解決方案）解決方案是我唯一提出的解決方案。 順便說一下，有兩件事：

1-你的Doctype聲明正在觸發怪癖模式，因為img標簽沒有正確關閉xhtml樣式。

2- Paniyar為CENTER的Float開發了一處新物業。 它不存在。 至少不在我的書中。

我的兩分錢......