【问题标题】:Internet Explorer 9 - Resize image proportionallyInternet Explorer 9 - 按比例调整图像大小
【发布时间】:2011-12-16 02:50:57
【问题描述】:

我正在尝试仅使用 CSS 来限制图像宽度:

#lateral-derecho #patrocinadores img
{
    max-width: 130px;
    height: auto;
    margin: 0 auto;
}

除了 IE 9 之外,每个浏览器都可以正常运行。它并没有按比例进行。我在<meta http-equiv="X-UA-Compatible" content="IE=8" /> 运行它。

顺便说一句,标准模式下的 IE 9 甚至不理解 margin: 0 auto; 还是我做错了什么?他们又做了一个糟糕的浏览器?

编辑:这是所有的 CSS、容器 (#patrocinadores) 和 img,img 包含在 #patrocinadores > a > img 中:

#lateral-derecho #patrocinadores
{
    float: right;
    width: 136px; 
    margin-top: 25px;
    padding: 15px 0 5px;
    background: url(images/top-patrocinadores.png) top no-repeat #eee;
    text-align: center;
}

#lateral-derecho #patrocinadores a{display: block;}
#lateral-derecho #patrocinadores img
{
    max-width: 130px;
    height: auto;
    margin: 0 auto;
}

【问题讨论】:

    标签: css image resize


    【解决方案1】:

    摆脱height: auto;。你不需要它,这就是问题的根源。

    【讨论】:

    • 不,实际上,如果我摆脱它,所有浏览器都会不按比例调整它的大小,IE9 也是如此,所以我需要它才能让真正的浏览器正常工作。谢谢
    • @user761076 不,那么您在其他地方有一些不正确的 css。如果您不告诉他们,为什么其他浏览器会设置高度?不。您在此图像上设置高度的地方,您不应该这样做。使用 firebug 找出位置并将其删除。
    • @user761076 嗯 - 您是否在图像标签中包含了高度?如果您要删除它(以及宽度)。不要在标签和css中都设置维度,这会导致奇怪的问题。
    • 不,图片标签中没有高度,任何容器中都没有高度
    【解决方案2】:

    试试这个:

    #lateral-derecho #patrocinadores a {
        display: block;
        max-width: 130px;
    }
    #lateral-derecho #patrocinadores img {
        max-width: 100%;
    }
    

    如果您想要 IE AlphaImageLoader 并将 sizingMethod 设置为 scale

    【讨论】:

    • 谢谢,但也不起作用...您确定IE9不会在您的机器上执行此操作吗? IE8 可以正常工作,但 IE9 不能...
    猜你喜欢
    • 1970-01-01
    • 2011-09-20
    • 1970-01-01
    • 1970-01-01
    • 2016-03-10
    • 2017-09-04
    • 2012-08-09
    • 1970-01-01
    • 2016-01-09
    相关资源
    最近更新 更多