Question

当我从右侧缩小浏览器窗口时，最近的推文div将位于容器div下方。我想这样做，以便最近的推文div不会比容器div的右边框更左边。我一直想弄清楚它是否可以用css完成，但我似乎无法得到它。是否有适合该法案的简单JavaScript解决方案？

谢谢！

Answer 1

您可以选择使用液体布局或使用css属性位置。

液体布局：

您的包装器div中有3个DIV，并且您希望它们在较小的浏览器窗口上调整大小，您可以使用变为宽度变化的百分比来执行此操作：

<强>的CSS：

.wrapper {
  width:100%
}
.divleft {
  float:left;
  width:20%
}
.divmiddle {
  float:left;
  width:60%
}
.divright {
  float:left;
  width:20%
}

<强> HTML：

<div class="wrapper">
   <div class="divleft">left</div>
   <div class="divmiddle">middle</div>
   <div class="divright">right</div>
</div>

正如我所说，另一种可能性是将css属性位置分配给不同的DIV。

亲自尝试，相当容易：

Answer 2

您还可以防止它们垂直重叠：

.noOverlap{
   float:left;
   width:100%;
}