html - How to put this image vertical? -
html - How to put this image vertical? -
i have div main wrapper, image-wrapper div image wrapper, , .
what want under lower resolutions (1300px example), image-wrapper div remain vertically aligned. now, when see it, not vertically aligned. top padding keeps image-wrapper div stuck top, while on bottom there big gap.
here site:
http://namdarshirazian.com
it happens in homepage. central image.
here id of main div:
#homepage-image
here css of 3
#homepage-image { padding: 20px 20%; border: 2px #ccc solid; background-color: white; text-align: center; overflow: hidden; height: 540px; } #homepage-image div { height: 495px !important; padding: 0px !important; } #homepage-image div img { width: 100% }
and here markup of element:
<div class="image" id="homepage-image"> <div style="height: 520px; overflow: hidden;"> <img src="photo/homepage/image.jpg" alt="" title=""> </div> </div>
the css located in style.css line 187.
i appreciate if live edit. in advance
<div class="image" id="homepage-image"> <div style="height: 520px; overflow: hidden; white-space: nowrap;"> <span class="keepimgvercenter"></span> <img src="photo/homepage/image.jpg" alt="" title=""> </div> </div> .keepimgvercenter{ display: inline-block; height: 100%; vertical-align: middle; }
hope helps.
html css css3 vertical-alignment
Comments
Post a Comment