html - CSS Image pos middle in dynamic proportionally height/width div -
need solve little task:
- center vertically , horizontally image in div.
- div height must proportional width.
- div width stretchable (for example 50% of parent div).
- image width , height = auto (it must fill div if width or height > div width or height, , have primary size if < div size, , stay proportional).
i know how make 2 , 3.
html:
<div class="container"> <img src="img.png"/> </div>
css:
.container { width: 100%; height: 0; padding-bottom: 100%; }
but how center , middle image in div? there lot of ways make 1 task non proportional , non strechable div. dont know how make in full house of tasks.
can help? html , css may any.
did try :
.container img { vertical-align : middle }
? verticaly align image.
Comments
Post a Comment