如何使绝对元素响应流动？

Question

我将这些图像定位为绝对值，左/上为百分比。

但随着缩小浏览器宽度，图像开始重叠。我还没有设置第3和第4行的位置，但正如您所看到的那样，它们相互重叠。

由于图像的设定距离％，我猜测它是不是？如何定位图像以使它们与浏览器宽度减小时保持相同的形式？

我的容器设置为相对块，图像为绝对，宽度为％，高度为px。

我从这个设计中得到了这个想法http://builtbybuffalo.com/，但我不知道他们是如何做到的。

Answer 1

他们这样做的方式是media queries。 基本上，当内容开始变坏并添加额外的CSS以进行必要的调整时，他们会设置断点。

你可以在他们的css here中看到这一点。在该文件中搜索此字符串：@media screen and (max-width: 1180px)并查看其下方的CSS（您应该格式化CSS，因为它已缩小，您可以使用Chrome开发工具或this之类的东西来实现。） / p>