Firefox / IE CSS问题 - 图像未缩放到百分比

Question

我在本网站的主页上使用第三方全屏滑块。每张幻灯片中的图像设置为不大于75％的宽度，它似乎适用于Safari和Chrome，但不适用于IE（11）或Firefox。

有什么想法与这个有关吗？

http://www.communitychurchbunnell.com

Answer 1

设置宽度以使其适用于IE

#main-content #fullpage .section img, #main-content #fullpage .slide img {
  width: 100%;
  max-width: 75% !important;
}

另外，！重要没有必要。

修改

.fp-tableCell div被设置为图像的宽度。 在文件jquery.fullpage.min.js中添加max-width：100vh来解决问题：

.fp-tableCell {
 display: table-cell;
 vertical-align: middle;
 width: 100%;
 height: 100%;
 max-width: 100vw;
}

Answer 2

显然，FF和IE中的表/单元格内的图像上有max-width的问题（还没有测试过其他的），但我最终解决这个问题的方法是添加table-layout：fixed;到设置为display：table

的元素