css - Why do I need "height: auto" for responsive images? -


is necessary define height: auto days? , reasons is?

img {     max-width: 100%;     height: auto; } 

thanks.

it makes sure image displayed in original aspect ratio. it's common technique realize responsive display of images. important part set either width or height soemthin other auto. browser resize image, maintaining aspect ratio.

max-width: 100%; in code example makes sure image never displayed wider parent container.

in code example, setting not necessary:

most <img> have so-called intrinsic dimensions (such jpg, png, gif). in case, stating neither width nor height explicitly makes browser use intrinsic dimension default given image. specifiy 1 of these, other set auto.


Comments

Popular posts from this blog

javascript - Bootstrap Popover: iOS Safari strange behaviour -

Website Login Issue developed in magento -

Can the constants be defined inside a model file of a framework in PHP? -