<a>タグのスペースが<img>タグここ

Question

のようにその内容に適合しないと、このコードは、次の絵につながる

<a href="#" style="background-color:red; padding:30px;"> 
<img src="cat.jpg" style="width:150px; vertical-align:bottom;"/></a> 

コード

ですイメージに収まるようにサイズが大きくならない。ご覧のように、イメージはオーバーフローします。私は "display：inline-block"を持っていれば、この問題を解決することができますが、アンカータグの中にテキストがあると、

Answer 1

あなたはの下部に{ display: block; }

Answer 2

にスペースを<a>タグを設定することができIMGの行の高さ

a img { 
    line-height: 0; 
} 

されていますし、また、IMGの表示を設定することができます。表示ブロックもブロックする