第一次加载页面时Chrome / Safari图像高度问题

Question

我正在做我的第一个网站并决定使用Bootstrap3。我已经开始使用四个功能＆＃39;列中每个图像有一个图像。我包含了我的开发者版本的链接：

http://tymekpudlik.github.io/kajtek/

在Chrome / Safari中，有一个问题是，当我们第一次启动网站时，四个图像图标（大脑图像部分）的高度要大得多。我打开Chrome DevTools并单击图像的css height属性，再输入一次相同的百分比值（90％），图像将更改为正确的大小。问题仅适用于Chrome / Safari。

图像的css属性没有什么特别之处：

img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    height: 90%;
    width: 90%;
}

我真的很感激任何帮助。谢谢！

Answer 1

更改img的父元素的样式（即div with class＆＃34; feature text-center＆＃34;）

height:auto;代替height:100%;

这个技巧可以帮助你......