0

次のコードは、トランジショナル Doctype では完璧に機能しますが、厳密な Doctype を使用すると、小さな下枠が表示されます。理由がわかりません。

<div class="image"><img width="100" height="100" src="aaa.jpg" title="aaa" alt="aaa" /></div>

        div.image {
            -moz-box-shadow: 0 0 5px #939393;
            -ms-box-shadow: 0 0 5px #939393;
            -o-box-shadow: 0 0 5px #939393;
            -webkit-box-shadow: 0 0 5px #939393;
            box-shadow: 0 0 5px #939393;
            padding: 2px;
            display: inline-block;
        }

任意のヒント？

Edit1: 理想的には、イメージ クラスは高さと幅の情報を持つことができません。

4

1 に答える 1

1

画像サイズで画像ホルダーを作成し、残りを非表示にします。

<div class="image">
    <div class="imageholder">
         <img width="100" height="100" src="aaa.jpg" title="aaa" alt="aaa" />
    </div>
</div>

.image {-moz-box-shadow: 0 0 5px #939393;
        -ms-box-shadow: 0 0 5px #939393;
        -o-box-shadow: 0 0 5px #939393;
        -webkit-box-shadow: 0 0 5px #939393;
        box-shadow: 0 0 5px #939393;
        padding: 2px;
        display: inline-block;} // anything, like border, etc.
.imageholder {width: 100px; height: 100px; overflow: hidden;}
于 2012-05-22T15:00:12.003 に答える