無法正確居中div

這是一個問題，我遇到了很多麻煩：我無法正確地將我的div放在我的網頁上。情況如下：我試圖集中的div是另一個div。經過大量研究和數百種失敗的方法之後，我設法將其集中。但是，當我使視口小於div時，它突然不再居中並浮動到左側。我只有在無序列表（導航）在div中的這個問題。無法正確居中div

這裏是我的網頁的代碼（簡體）和JSBin：

<body> 
    <div id="container"> 
     <header id="topheader"> 
      ... 
     </header> 
     <div id="content"> 
      ... 
      <div id="images"> 
       <ul> 
        <li><a href="#"><img src="..."></a></li> 
        <li><a href="#"><img src="..."></a></li> 
        <li><a href="#"><img src="..."></a></li> 
        <li><a href="#"><img src="..."></a></li> 
       </ul> 
      </div> 
      ... 

     </div> 
    </div> 
</body>

的問題是與圖像股利。頁面上還有其他類似的東西。

我的問題是：爲什麼它這樣做，以及如何解決？

來源

2013-12-21 Creator13

您可以創建你的CSS的部分不工作的www.jsbin.com或www.jsfiddle.com最小採樣。同時粘貼您的div＃內容容器 – drinchev

也div＃容器和

請粘貼css –

使用__margin：0 auto; __居中任何元素 –

margin:0 auto;中心的股利，而不是內容....我的意思是說，如果你的div是60px廣泛，內容僅30px寬，然後在div將調整到中心，但內容仍然會align到div的一面，而不是在市中心，給人一種觀點，即股利不集中.....我的建議是使用text-align財產也與margin

看到這個DEMO並注意border明白該div是居中....但內容不是〜

CSS

#content { 
    width:98%; 
    margin:0 auto;/*center div*/ 
    border:1px solid #000; 
} 
#images { 
    width:98%; 
    margin:0 auto;/*center div*/ 
    border:1px solid #CCC; 
    text-align:center /*center text*/ 
}

來源

2013-12-21 14:21:49 NoobEditor

無法正確居中div

回答

相關問題