如何在不知道宽度的情况下对齐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？

回答

相关问题