html - div全体に画像を収める

Question

cssを使用してdivを作成するときに、画像がdiv全体に完全に収まらないようにするにはどうすればよいですか。代わりに縮小します。現在の画像 http://img90.imageshack.us/img90/510/pictureframe.png

cssパート

#avatar{
padding:35px;
height:70px;
width:50px;
margin: 0px 0 0 0px;
background-color:red;
}

html部分

<div id="avatar">
<img src="/Avatar.png" style="width: 100%;" style="height: 100%;" alt="">
</div>

Answer 1

2つのスタイル属性を使用しているため、後者の1つが最初の1つを引き継ぐため、幅を100％に設定するのではなく、高さのみを設定します。

<img src="/Avatar.png" style="width: 100%; height: 100%;" alt="">

CSSに気付いたのですが、画像の周りに赤い背景が見えるようにパディングを使用しています

デモ