1

別のラッピングdivの内側に、幅150px、境界線1pxのdiv要素があります。同じ幅150pxのIMGアイテムが含まれています。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