html - image height 100% comes out larger than div -


i'm trying make image inside div 100% of height, width proportional. when set height 100% comes out larger div. misunderstanding height 100% means?

here's css:

#whoami_bg {     position: absolute;     left: 3%;     top: 26%;     width: 45%;     height: 35%;     background: rgba(50, 204, 239, 0.4); } #whoami_bg img {     height: 100%;     width: auto;     display: block;     margin: 0 auto; } 

and here html:

<div id="whoami_bg">     <br /> <a href="whoami.html">         <img src = "images/whoami_image.gif" />     </a> </div> 

it scale, scales big. happens in chrome , safari @ least. have tried giving image class = "whoami" , putting style in img.whoami tag, works same. reason images have decided give 110%. :p

it seems simple; how make image 100% height of div?

remove tag code:

<br /> 

it pushes <a> content down , overflows it's parent container.


Comments

Popular posts from this blog

c++ - How to add Crypto++ library to Qt project -

jQuery Mobile app not scrolling in Firefox -

How to use vim as editor in Matlab GUI -