Div忽略设置宽度约束，CSS

全部。我有一个问题，我已经明确规定了某个div d应该有多宽，但它忽略了它。 我有一个包装，在里面我想要一个并排的边栏和一个内容栏。内容栏似乎推开了侧边栏，填满了所有的空间

有关守则：

#wrapper{
    font-family: "Georgia", serif;
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -2em;
    width: 700px;
    position: relative;
}

#content{
    float: left;
    width: 400px;
    padding-left: 25px;
    padding-right: 50px;
}

#sidebar {
    float: right;
    width: 175px;
    padding-right: 25px;
}

而且HTML很简单 废话连篇 简而言之

我把Lorem Ipsum放在内容所在的位置，在侧边栏中放了一些Lorem Ipsum。chrome中的Element Inspector显示的内容是700像素宽，尽管我声明它是400px。我真的不在乎ie6的兼容性

这就是它应该看起来的样子

有人说了些关于小提琴的事。我这样做对吗

---

大的Lorem Ipsum块更薄，只有400像素的文本，而侧边栏应该向上移动并插入到它旁边。

您的代码中有一些基本的HTML和CSS语法问题：

• HTML结尾标记应该是
  写的，永远不要

好:

内容

坏的：

内容

• CSS注释必须是

  /*CSS注释*/

  ，而不是

在发布之前，您应该尝试在（HTML）和（CS）中验证代码（使用Firefox上的Web Developer工具栏扩展快速验证）。
错误消息有时有点神秘，但它们总是一样的；）谷歌让他们得到解释，或者在这里询问

---

对于宽度问题，我为元素和父元素添加了不同的背景色，以便更好地查看哪些元素和父元素不符合预期（哪些元素只有浮动子元素，因此流中不再有真实内容，因此没有高度，因此没有可见的背景色……）。像浅蓝色、浅绿色、粉红色、浅黄色等等，这和测量！Fx上的扩展。

请同时发布HTML代码或一个提琴这里有一个提琴：

#内容

对于我来说不会显示为700px宽。它的宽度是475px，因为有填充物。我想这是一个快速的解释。

    <div id="content" class="something" role="main">
      <p>Content</p>
    </div>

    <div id="content" class="something" role="main">
      <p>Content</p>
    </div id="content" class="something" role="main">