html - Image won't resize with browser size -
i trying have image next text. want vertically centered text offset left isn't overlapping text. can achieve whenever resize browser , make smaller image not move.
i have tried putting text within text whenever text doesn't center properly. have add link underneath image don't think best way go.
here jsbin of problem code: http://jsbin.com/evasix/2/ **i included full code in jsbing because think may being inherited div class.
html:
<div class="middle"> <div class="side-img"> <h2>millions of entrepreneurs, freelancers, small<br>businesses, , departments inside big<br> organizations rely on our web apps.</h2> <img src="images/img-customerss.png" class="customers"> </div> </div>
css:
h2 { position: relative; top: -30px; text-align: center; font-size: 45px; color: #232323; font-family: 'crimson text', serif; line-height: 50px; } .customers { position: relative; bottom: 150px; left: 425px; }
that because using pixel distances edges. pixel fixed size, , resizing window wont cause adapt. try using unit of measurement such %
.
hope helped. luck.
Comments
Post a Comment