Question

我正在尝试将2个流体div并排对齐这里是预览http://jsfiddle.net/238ha/ 现在看起来像什么我想做的是，有两个div

这是当前的代码

.images {
  border: 1px solid red;
  position:absolute;
  top:40px;
  left:0px;
  float:left;
  width: 25%;
  min-width: 305px;
  height: 95%;
}
.content {
  border: 1px solid blue;
  position:absolute;
  top:40px;
  left: 25%;
  width:70%;
  min-width: 60%;
  height: 95%;
}

这是我想要完成的事情

图片：占据屏幕的25％

内容：占据屏幕的75％

然而，当用户调整屏幕大小时，div可能会变大，但是他们可以获得的数量有限。我已经阅读过有关flexboxes的内容，我认为它们可能会有效，但它们仍然不能为它们提供很好的支持，而且我还没有能够使用“flex-flow：row”取得任何成功。我也在网站上使用bootstrap，所以如果你知道如何做这个是更好的bootstrap。我很感激帮助。

Answer 1

您可能希望了解响应式设计。对于高于最小宽度的任何内容使用流体布局，并在下方固定。您应该查看media queries以获得一些帮助。

Answer 2

如果一个div有“float：left”到另一个div，你必须在其规则中设置“float：left”。因为如果没有他们在同一条线上，所以第一个在左边和第二个边做同样的事情，但它在第一个左边找到所以它将一直到此。

两个流体div并排

2 个答案: