图像大小与不同的浏览器不兼容

Question

我在网站的.img元素中创建了css样式：www.piyarawatan.com 在网页的右侧栏中，搜索框下方有报纸的预览图像。当我在firefox中打开这个网页时，它工作得非常好，图像大小完全符合我的需要但是当我在谷歌浏览器中打开同一个网页时，它的图像高度会延伸到很长，宽度会缩小。问题是什么？我的CSS有什么问题吗？我该如何解决呢？感谢

img[Attributes Style] {
    height: 150%;
    width: 100%;
}

li {
    display: list-item;
    text-align: -webkit-match-parent;
}

Answer 1

您不应将width和height属性放在<img> - 标记中。我要做的是像这样在图像元素中添加一个类：

<img class="some-name" />

然后只需添加以下CSS：

.some-name {
    width: 100%;
}

即。只需从图像元素中删除宽度和高度，然后添加如上所述的css类。通过执行width: 100%，您可以强制被视元素继承父元素的最大宽度。