css - 在 Chrome Bootstrap 中不断改变网格中图像之间的垂直间隙

标签 css image layout grid positioning

我有一个画廊的图像网格,在浏览器具有一定宽度的某些情况下它看起来不错,但是当您在 Chrome 中缩小浏览器的大小时,它会改变元素之间的垂直间隙。在 Microsoft Edge 中,它按预期工作(未尝试过 Firefox)。我需要保持垂直间隙一致,高度只有大约 10 像素。

以下是浏览器之间的区别: https://i.imgur.com/7ZoA6Fz.jpg

要亲自尝试一下,请使用 Chrome 浏览器并查看以下链接的结果,并调整预览窗口的大小以触发断点。

https://www.codeply.com/go/DUmlhXetYE

如果您不能重现该问题,则可能是浏览器更新问题...

最佳答案

如果您删除 .gallery-item 上的 display: flex;,边距是一致的。

在 chrome、ff 和 edge 中似乎没问题。

关于css - 在 Chrome Bootstrap 中不断改变网格中图像之间的垂直间隙,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50894287/

相关文章:

css - 如何定位两个透明图像以重叠容器 div 的对 Angular

angularjs - 了解 Angular JS 中的 localhost 图像加载错误

Android:使用可移动边框拆分 Activity

android - Facebook Android 应用程序新闻提要布局

html - CSS 样式表移动布局,页面右侧有巨大的空白

javascript - 使用 javascript 旋转文本 - 在 IE8 中不起作用

html - CSS :nth-child randomly skips a list item

android:ImageView高度宽度与源图像拟合

css - 为什么表格组会偏移行?

css - 水平居中 zurb 基础顶部栏菜单,多行元素垂直居中