css - 无法调整 img Internet Explorer

Question

我经营一个网站，我最近发表了一篇文章，这篇文章在 Chrome 和 FireFox 上完全没问题，但在 Internet Explorer 上有一些问题。

涉及的页面是 this one .

为了简单起见，我在这里分享了一部分代码:

<figure class="appFigureElement" id="airDroidFigure">
    <a href="https://play.google.com/store/apps/details?id=com.sand.airdroid&hl=en"><img id="airDroidPicture" class="imageApps" alt="airDroid" src="path to image"/></a>
    <figcaption id="airDroidCaption">
        <p> blablabla </p>
    </figcaption>
</figure>


.imageApps
{
    width: 75px;
    height: 75px;
    float: left;
    padding-right: 10px;
}


.appFigureElement
{
    padding-bottom: 25px;   
}


function setFigureHeight(figure, picture, caption)
{
    var figureEl = jQuery("#" + figure);
    var pictureEl = jQuery("#" + picture);
    var captionEl = jQuery("#" + caption);

    if(pictureEl.outerHeight(true) > captionEl.outerHeight(true))
        figureEl.height(pictureEl.outerHeight(true));
    else
    {
        figureEl.height(captionEl.outerHeight(true));
        var mrgBott = captionEl.outerHeight(true) - pictureEl.outerHeight(true) + 15;
        pictureEl.css("margin-bottom", mrgBott+"px");
    }



}

基本上在 onLoad 事件中，我运行 js 函数，根据 CSS 格式化每个“图 block ”(图形元素)。

问题是在 IE 中，CSS 就像丢失了一样，因为图片非常大，无论我如何尝试调整它们的大小(html 内的 css，图外的 img 等等)我总是得到巨大的图像，而在 Chrome 和 FF 中一切都很好。

你有什么建议吗？

请注意，该网站是用 WordPress 开发的

Answer 1

在您的 style.css 中，存在一条规则:

.ie #content img, .ie #comments img, .ie .sidebar img {
    height: auto;
}

那是你的罪魁祸首。

只是为了进一步解释，此规则是在您的规则之后编写的，使其覆盖您用来调整图像大小的 .imageApps 类。由于它仅适用于 IE，因此您在其他浏览器中没有看到此问题。