我正在处理一个大表单,并注意到如果图像位于字段集中,则它不遵守 max-width: 100%
规则。
它在 Chrome 和 Safari 中按预期工作,但在 Firefox 中图像溢出容器并且图像保持其正常大小。
我宁愿不更改 html 结构并将图像保留在字段集中。
如果有解决方法或者为什么这只发生在 Firefox 中,有人有任何想法吗?
最佳答案
对于纯 CSS 解决方案,请查看此链接 http://codepen.io/saig/pen/RNXLwY 使用 800x400 和 400x400 图像尺寸进行测试
img {
width: 100%;
max-width: -moz-fit-content;
max-width: -webkit-fit-content;
height: auto;
}
您可以查看此链接以了解 MDN 的最大宽度实现 https://developer.mozilla.org/en-US/docs/Web/CSS/max-width?redirectlocale=en-US&redirectslug=CSS%2Fmax-width#Examples
关于html - Firefox - 最大宽度图像在字段集中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29525178/