如何在不知道寬度的情況下對齊div？

我已經看過這個了，前景看起來很暗淡。我對使用表格不感興趣。我有6個左右的'元素'內嵌塊組成菜單。這是光滑的，除了所有'a元素'被設置爲寬度：auto;以適應他們的文本。沒有明確的寬度，我無法居中對齊它們。我有一個容器div和一個圍繞我的'元素'的子div。如何在不知道寬度的情況下對齊div？

有什麼想法？感謝邁克

來源

2009-07-14 Mike

能你提供了一個HTML和CSS的樣本？ – ylebre 2009-07-14 07:38:19

你可以設置一個元素到保證金的風格：0汽車，但是，這並不工作在IE6。在IE6，你應該包裝的div設置爲的text-align：中心，和（可選）設置文本對齊方式的一個元素回的text-align：左

來源

2009-07-14 07:38:22

我需要孩子div相對定位w/text-align：center。這解決了這個問題。謝謝！ – Mike 2009-07-14 08:03:13

<div style="width: auto; margin-left: auto; margin-right: auto"> 
div content 
</div>

會對齊頁面上的中心

來源

2009-07-14 07:40:16

將無法在IE6中工作 – 2009-07-14 07:47:15

您需要在外部容器div上設置margin: 0 auto;，在內部div上添加text-align: center;;並首先使用無序列表來構建菜單。

來源

2009-07-14 07:40:47

如果未設置寬度值，則div元素將獲取容器元素的所有寬度空間。

所以，如果要居中你必須設置一個寬度一個div ...

一個解決問題的方法（如果我理解它）可以是：

<div style="text-align:center;"><span>[... yours content ...]</span></div>

在您的div有成爲一個跨度，新的div將跨度放在中心位置。希望這可以幫助你！ Bye， Alberto

來源

2009-07-14 07:48:22 Alberto

沒有設置明確的寬度，<div>標籤會自動擴展到其父寬度的100％。因此，設置margin: 0 auto;將使其居中 - 左側和右側均爲0px。

來源

2009-07-14 07:52:25 Kerrick

-1

如果您需要居中並動態縮小/擴大以容納內容而不知道寬度，那麼您唯一的選擇就是使用表格。它是HTML曲目中唯一的彈性元素。

<table style="margin-left:auto;margin-right:auto;"> 
    <tr> 
     <td> 
      Whatever... 
     </td> 
    </tr> 
</table>

P.S.通過將float屬性設置爲float：left或float：right，您也可以動態縮小div。所以它會堅持左或右，但你不能以這種方式居中。

來源

2009-07-14 08:04:13 User

我的建議是這個答案 - 但有人評論說，它不會在IE6中工作。以下是如何使這項工作：

<div id="container"> 
    <div id="centeredBlock">centered</div> 
</div> 

#container { 
    text-align: center; 
} 

#centeredBlock { 
    margin: 0 auto; 
    text-align: left; 
    width: 50%; 
}

來源

2009-07-14 08:18:09 Ross

這裏一個很好的解決方法定心一個div沒有寬度：

http://www.kensfi.com/how-to-align-center-a-div-with-no-width-declared/

來源

2010-05-14 01:41:55 Snowalker

這裏同時進行的情況一個很好的例子：http://www.cssplay.co.uk/menus/centered.html

來源

2011-09-03 21:52:02

如何在不知道寬度的情況下對齊div？

回答

相關問題