Html 五柱网轴线未正确缩小

我使用的是最大宽度为1280px的流体网格。 网格的最小宽度为950px

在我的示例中，我使用了3种不同的网格大小-grid6、grid8和grid12。 还有一个grid16和grid24，但在本例中不使用它们

这是我的小提琴：

缩小浏览器窗口时，最小网格（grid6）的高度不等于其余网格的高度。Grid6在高度上小于其他网格尺寸

以前是否有人经历过这种情况？是否有一种不使用媒体查询的解决方案

.grid6_asset,
.grid8_asset,
.grid12_asset,
.grid16_asset{ 
    float:left;
    position:relative;
}
.grid6_asset{
    width:20%;
}
.grid8_asset{
    width:40%;
}
.grid12_asset{
    width:60%;
}
.grid16_asset{
    width:80%;
}
.grid24_asset{
    width:100%;
}

---

如果为图像设置

宽度

或

高度

，则会根据纵横比自动计算其他属性。在您的小提琴中，所有图像的高度都相同，但宽度不同。因此，如果您将其设置为宽度和离开高度，高度将自动计算，并且由于图像的宽度和纵横比不同，计算的高度也会不同

如果设置图像的高度，则无论窗口大小如何，高度都将相同，但宽度将自动计算，并且与本例中的纵横比不同

---

如果您明确地设置了高度和宽度，那么纵横比将受到影响。

好的

grid6

的宽度仅为

20%

宽度，其余部分则比这宽。。当页面大小更改时，所有div的宽度将相应地放大或缩小。。无论如何

40%

始终大于

20%

。。你还指望什么。。？！！我不知道是我解释错了还是你误解了？你检查过我的小提琴了吗？我很清楚，40%大于20%，但在我的示例中使用的网格高度在缩小时会有所不同。即使它们应该具有相同的高度。当将窗口缩小到950px时，高度会有3个像素的变化。您的问题说

grid6

比其他网格小，它没有提到任何关于

高度的内容，您在我发表评论1小时后的编辑中添加了它。LOL缩小时，栅格会彼此溢出，不会缩小。我希望整个网格缩小，缩小时网格的高度应相同。如果保持高度相同，并根据窗口大小减小宽度，则图像的纵横比显然会改变。。好吗..？应该和我做的小提琴一样，整个网格都在缩放，但这把琴有一个bug。当缩放到950px的最小宽度时，grid6的高度比其他网格小3倍。所以我不认为设置高度会使整个网格可缩放。