CSS-Div填充“除z像素外的所有像素”

Question

I have a div that needs to stretch the whole way across the page, but the actual content should only be z pixels wide, and centered. 我有一个div，它需要在整个页面上延伸整个方向，但是实际内容应该仅是z像素宽且居中。 That is, the text is not centered, but the area where the content is - the interior of the div, if you will - is centered. 也就是说，文本不是居中，而是内容所在的区域-div的内部（如果需要的话）是居中的。

The logical approach is to do something like this: 逻辑方法是执行以下操作：

<div>
<!--I stretch across the entire page!-->
 <div>
 <!--I am z pixels wide, and my margins are auto. Content goes here.-->
 </div>
</div>

The only problem with this is that it seems really div-itis-y. 唯一的问题是，它看起来确实很复杂。 This is something that should be able to be achieved using the box model. 使用盒子模型应该可以实现这一点。

Is there anyway to do this without adding divs? 无论如何，不添加div就能做到这一点？

Answer 1

body already stretches the width of the page, so just use that one interior div body已经拉伸了页面的宽度，因此只需使用一个内部div

something like 就像是

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

and 和

div{
    width:980px;
    margin:0 auto;
}

This is what div s are meant to do. 这就是div的作用。

Now, depending on the content and whether or not you are using HTML5, you may want to wrap it all in another element tag, such as header , nav , section etc. 现在，根据内容以及是否使用HTML5，您可能希望将其全部包装在另一个元素标签中，例如header ， nav ， section等。

But there is nothing inherently wrong with using div s, even nested ones. 但是使用div ，即使是嵌套的，也没有本质上的错误。

CSS-Div填充“除z像素外的所有像素”

问题描述

1 个解决方案

解决方案1
3 已采纳 2011-10-02 02:23:53

CSS-Div填充“除z像素外的所有像素”

问题描述

1 个解决方案

解决方案1 3 已采纳 2011-10-02 02:23:53

解决方案1
3 已采纳 2011-10-02 02:23:53