宽度为 100% 的 Div，紧挨着固定宽度的 1答案

【问题标题】：Div with a width of 100%, next to a fixed width one宽度为 100% 的 Div，紧挨着固定宽度的 1
【发布时间】：2011-10-05 19:49:20
【问题描述】：

抱歉这个非常愚蠢的问题，我觉得在大多数情况下我都可以轻松做到这一点，但我现在正在使用 sharepoint 并且试图在这方面做任何事情都是地狱！

基本上，我有一个 230 像素宽的侧边导航 (.menu-vertical)，旁边有一个 div (.mainContent)，我想（填充一边！）填充屏幕的其余部分。

不幸的是，代码中还有大约 798 个随机放置的 div、span 和其他任何东西，我似乎无法在不破坏网站的情况下删除它们，因此非常感谢任何关于如何实现这一点的建议，谢谢！

【问题讨论】：

在阅读最后一段之前，我已经准备好回答您的问题了。没有人能真正帮助你..
试试你在标题中的建议——给它width: 100%？也许您需要将它们都包装在容器 div 中并浮动它们？或者也许只是用width:100% 浮动它们？
@thirtydot - 不幸的是，Sharepoint 似乎没有任何办法解决这个问题，尽管该网站的基础是 .container div 和 .menu-vertical（固定）和 .mainContent (fluid, 100%) 里面的 div。
@jtfairbank - 非常感谢，但我已经拥有 100% 的容器 div 和 230px 的侧边菜单，但是我给主要内容区域提供什么属性？宽度 100% 使其与容器的宽度相同。再次感谢。
赏金对您最后一段根本无法回答的部分无济于事。我只是假装它不存在并回答。

标签： css sharepoint html width

【解决方案1】：

基本上我有一个 230 像素的侧边导航 (.menu-vertical) 宽，旁边有一个 div（.mainContent），我想（除了填充！）填满屏幕的其余部分。

..

网站的基础是 .container div，并且 .menu-vertical (fixed) 和 .mainContent (fluid, 100%) divs 在里面。

据我了解，您正在寻找这个：http://jsfiddle.net/thirtydot/wv42t/

CSS：

.container {
    border: 3px solid #666;
    overflow: hidden
}
.menu-vertical {
    width: 230px;
    float: left;
    padding: 10px;
    border: 2px solid #f0f
}
.mainContent {
    overflow: hidden;
    padding: 30px;
    border: 2px solid #00f
}

HTML：

<div class="container">
    <div class="menu-vertical">menu-vertical</div>
    <div class="mainContent">mainContent</div>
</div>

【讨论】：

这确实有效，非常完美 - 谢谢！我一直在玩代码直到昨晚深夜并想出了类似的东西，但这很棒而且非常简单，喜欢这个解决方案！再次感谢