html - 在 100% 宽度的 div 旁边 float div

Question

我想在内容为 width: 100% 的 div 旁边放置一个 div。所以标记是:

<div id="left_sidebar" style="float: left; height: 100%; width: 150px;"></div>
<div id="outer_wrapper" style="position: relative; float: left;"></div>

#outer_wrapper 中几乎所有内容的宽度都是 100%。不幸的是，它不起作用。

我做了一个FIDDLE

Answer 1

怎么样:

#left {
    width: 150px;
    height: 1000px;
    background-color: green;
    float: left;
}
#right {
    width: 100%;
    height: 1000px;
    background-color: red;
    float: left;
}

<div id="right">
  content here
    <div id="left"></div>
  more content here
</div>

第二个选项:

删除 .right div 的宽度和 float 属性并给它 150px 的左边距:

#left {
    width: 150px;
    height: 1000px;
    background-color: green;
    float: left;
}
#right {
    height: 1000px;
    background-color: red;
    margin-left:150px;
}

<div id="left"></div>
<div id="right"></div>