Question

我遇到了以下问题。

我有一个类似于这个jsfiddle的设计：

http://jsfiddle.net/k3EUx/

我希望div endless能够向右延伸，就像你使用宽度100％一样。问题是它的左侧应该有一个徽标，所以我不能使用该属性。有没有办法做到这一点，而不只是做一个非常宽的div并使用绝对位置放置它？

我需要这个，因为网站本身宽1008像素，但菜单只是向右移动，所以如果你有一个大屏幕（比如1080），这将自动扩展。

（我假设您必须将div放在包装器之外，但我不知道从哪里开始这项工作）

Answer 1

您正在寻找的是液体/固定布局（如果您需要一些额外的示例，可以谷歌这些条款。）

您可以尝试这种CSS：

#header
{
    height: 50px;
    background-color: #666;
    margin-bottom: 10px;
}

#nav
{
    float: left;
    width: 180px;
    height: 150px;
    background-color: #999;
    margin-bottom: 10px;
}

#content
{
    margin: 0 30px 10px 210px;
    height: 150px;
    background-color: #999;
}

#footer
{
    clear: both;
    height: 50px;
    background-color: #666;
    margin-bottom: 10px;
}

找到here

Answer 2

我的理解：

你需要div id-“endless”，以便覆盖包装器的整个宽度。

如果我已经很好地理解了这个问题，你可以参考：http://jsfiddle.net/k3EUx/6/

Answer 3

肮脏的修复：

#endless {
    position: absolute;
    left: 99px;
    right: 0;
}

Div继续无穷无尽

3 个答案: