CSS: fit image inside div -


i want remove white line below following image:

enter image description here

my css:

#content {   float: left;   background:#fff;   bottom:0;   width:100%;   overflow:hidden; } #container {   position: relative;   overflow:hidden; } #container img {   width:100%;   height:auto } 

my html:

<div id="content">   <div id="container">     <img src="img/lib.jpg" width="100%"/>   </div> </div> 

i tried many tricks non of them working in browsers

img inline element default there space descenders on letters g, j. fix can add vertical-align: top on image.

enter image description here

#content {    float: left;    background: #fff;    width: 100%;  }  #container {    border: 1px solid black;  }  #container img {    width: 100%;    vertical-align: top;  }
<div id="content">    <div id="container">      <img src="http://placehold.it/350x150">    </div>  </div>


Comments

Popular posts from this blog

javascript - Clear button on addentry page doesn't work -

c# - Selenium Authentication Popup preventing driver close or quit -

tensorflow when input_data MNIST_data , zlib.error: Error -3 while decompressing: invalid block type -