私のhtmlです：不要なパディング下
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<div style="border:1px solid red; float:left; padding:0;">
<img src="xxx.jpg">
</div>
div要素は、いくつかのパディング下であっても、私はパディングを設定が含まれている理由を私は知らない：0。
DOCTYPEを削除すると、この問題は発生しません。 DOCTYPEを削除せずにこの問題を解決する他の方法はありますか？
img { display:block; }
または
img { vertical-align:bottom; }
働くだろう。画像はインラインであり、テキストはインラインであるため、ユーザエージェントはディセンダ文字（y、q、g）にいくらかの領域を残す。画像にこの効果を適用しないようにするには、上記のいずれかのスタイルを指定します。ただし、ルールをより具体的にして、適用したくない画像を対象にしないこともできます。
別の方法として別のポスターが指摘したように、親要素に0に行の高さを設定することです。
技術解説：行の高さを設定しhttps://developer.mozilla.org/en/Images,_Tables,_and_Mysterious_Gaps
問題がIEにある場合、この回答は最も論理的なようです。 – Sam152
これはIEに固有のものではなく、あなたの最愛のGeckoを含む多くの現代のレンダリングエンジンの自然な振る舞いです。 –
divのボトムパッドは実際には別のスタイルルール（たとえば、body要素の埋め込みなど）によって引き起こされる可能性があります。これは、ブラウザクォークモードを有効または無効にした場合（DOCTYPEその効果がある傾向がある）。
このような場合は、カスタムスタイルルールを使用してデフォルトのスタイリングをオーバーライドする必要があります。
Firebugは、どのCSSスタイルがどのDOM要素に影響するかを示すので、ここで大きな助けとなります。
：0; div形式で：
<div style="border:1px solid red; float:left; padding:0; line-height:0;">
<img src="xxx.jpg" />
</div>
imgはインライン要素です。したがって、descendersを持つ文字のスペースを節約します。 divの行の高さを調整することで問題は解決されます。必要に応じて、imgを変更してブロック要素として表示することもできます。
この問題はブラウザごとに発生しますか？ – rahul
興味深い質問。それで私はラインハイトとボックスモデルについて考えさせてくれました。 +1 – Abinadi
イメージ要素が 'div'や' td'の中の唯一の要素である場合は、さまざまなユーザーエージェントでよくあります。 –