1

我有一个 150px 宽度和 1px 边框的 div 元素，在另一个包装 div 内。它包含一个宽度相同的 IMG 项目，150 像素。包裹div的方向是从右到左（方向是rtl时会出现问题）

问题：当我在 IE9 中打开我的页面时，图像容器 div 有一个不需要的填充，并且图像从 div 的右侧掉出，超出了 div 的边界。取决于垂直滚动条的存在与否，问题会出现和出现。

<html>
    <head>
        <style>
            .wrap {
                width: 300px;
            margin: 0 auto;
                direction: rtl;
                padding: 0;
            }
            .img-container {
                width: 150px;
                height: 150px;
                border: 1px solid black;
                padding:0;
                margin:0;
                background: red; /*background to show the problem better*/
            }
            img {
                display: inline-block;
            }
        </style>
    </head>
    <div class="wrap">
        <div class="img-container";>
            <img  src="my-image.jpg" width="150px"/>
        </div>
    </div>
</html>

这是问题的屏幕截图：

IE9 中不需要的填充

这是一个已知的错误？我该如何处理？

4

0 回答 0