html - 两个 div,一个规定宽度,一个未知。如何解决这个问题

标签 html css

我有一个问题。

如果我在内容 div 中有 2 个 div 元素,例如“左”和“右”。

我希望左边的 div 宽度为:250px;,右边的宽度为:auto;,所以如果我缩小它,右边的 div 适合浏览器窗口。这可能吗?

我试过了,右边的 div 跳到了左边的下面,而不是在右边。

.content {width:1000px;}
.left {width:250px;}
.right {width:auto;}

最佳答案

只需 float left div,并使用 right 的左边距将其从左侧 div 下方移除:

.left {
    width: 250px;
    float: left;
}

.right { margin-left: 250px; }

只需确保您有 cleared the float容器的末尾。

例如:

.content:after { /* clearing the float */
  content: '';
  display: block;
  clear: both;
}

另外,您可能想看看 Nicolas Gallagher 的 micro clearfix hack ,或 this topic在 SO 上。

WORKING DEMO .

关于html - 两个 div,一个规定宽度,一个未知。如何解决这个问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22113073/

相关文章:

html - Chrome 在浏览器高度调整大小时挤压 <img>

javascript - 响应式设计文章的等高行

HTML 元素即使有宽度也不居中,并且是一个 block

javascript - 反转堆积条形图

javascript - 无法从右向左切换Jquery

javascript - 我们是否有任何 CSS 框架来制作桌面优先的 Web 应用程序

javascript - 单击菜单按钮,网站滚动到 div

jquery - 将视频播放器控件文本保持在适当位置

javascript - 根据另一个下拉列表填充一个下拉列表并获取 "value"而不是下拉列表显示值

html - 响应高度?