如何使div扩展为使用css的页面宽度？

我有一个页面有几个div，有点像这样：如何使div扩展为使用css的页面宽度？

<div id="div_one">blah blah blah</div> 
<div id="div_two">blah blah blah</div>

我希望他们水平居中，一个接一个和第二个扩展到页面的宽度。

来源

2009-09-09 Paul Wicks

.first_one 
{ 
    margin-left: auto; 
    margin-right: auto; 
    text-align: center; 
} 

.second_one 
{ 
    width: 100%; 
}

然后在您的视图，第一个你会做

<div class = "first_one"> 
... 
</div>

对于第二个，你会做

<div class = "first_one second_one"> 
... 
</div>

来源

2009-09-09 17:58:54 maksim

Div's默认为其容器的整个宽度。

要水平居中内容，请在其上设置“text-align: center;”。如果他们在一个容器中，也可以在容器上使用“margin: auto”，这会将左右边距设置为自动将div对中。

来源

2009-09-09 17:57:57 womp

* set'text-align：center;'on them *这只是针对IE6的破解 – voyager 2009-09-09 18:04:21

我是指内容，而不是div本身。可悲的是，IE6仍然是浏览器共享的重要部分。 – womp 2009-09-09 18:17:47

难道你不是指'divs默认情况下是整个内容的宽度吗？ – 2011-06-20 14:02:18

记住有上的元素默认边距所以尽管它是100％，但仍然可能存在一些差距。您可以使用一些CSS将页边距重置为0。

来源

2009-09-09 18:03:35 Nick

body{ text-align: center; } 

.first_one 
{ 
    width: 600px; /* Can be any width */ 
    margin:0 auto; 
} 

/* Reset text-align for child content */ 
.first_one, .second_one{text-align: left}

为了在IE6中居中“first_one”，您需要在父元素上设置“text-align：center”。在这种情况下，我假设这是身体节点。此外，除非您指定宽度，否则margin：0 auto不起作用。

然后，您需要在子div上设置文本左对齐，以便它们中的内容不居中。

您不需要在“second_one”上指定宽度，因为块元素自然会展开以填充其父容器。此外，通过不设置宽度，浏览器将考虑任何可以应用于“second_one”的填充，边距和边框，而不会破坏布局。

来源

2009-09-09 23:31:35 Kappers

如何使div扩展为使用css的页面宽度？

回答

相关问题