Question

我头疼的是如何让我的液体含量漂浮到右边。

左侧边栏是固定尺寸。
正确的内容是流动的大小。

此处和example我的html和css

如何让我的id="content"在右边浮动？

Answer 1

设置边距并删除#content上的浮动/宽度，如下所示：

HTML：

<div id="wrapper">
  <div id="sidebar">Sidebar</div>
  <div id="content">Content</div>
</div>

CSS：

#wrapper {
    width:400px;
    overflow:hidden;
    padding:10px;
}
#sidebar {
    float:left;
    width:100px;
}
#content {
    margin: 0 0 0 100px;
}
div {
    border:1px solid #333;
}

http://jsfiddle.net/HWMJc/1/

Answer 2

实际上有一个更简单的解决方案，这是我不久前发现的。适用于IE7。 #fluid div将在固定修复旁边向上滑动并占用剩余空间，同时保持所有响应站点的流动性。根本不需要在流体上放置浮子或宽度。

http://jsfiddle.net/HWMJc/874/

#sidebar {
  float:left;
  width:100px;
}
#content {
  overflow:hidden;
}

Answer 3

您应该将其设置为：

sidebar{ width:100px; float: left}

Answer 4

不要在#content上使用100％宽度。
70％有效，但两个元素之间存在小差距。你可以调整它以使它更适合。

如何在CSS中实现固定的左侧边栏和流畅的内容

4 个答案: