html - How to change divs placing from horizontal to vertical using css? -
i have 3 divs in footer, divs used footer , can see them horizontally on bottom of page.
<div class="footer-text footer_maindiv"> <div class="footer_leftdiv"> rights reserved </div> <div class="footer_middlediv"> <a href="url">help</a> </div> <div class="footer_rightdiv"> version 6.0 </div> </div>
with css:
.footer_maindiv { position: relative; width: 100%; border-top: 1px solid #eeeeee; margin: auto; } .footer_leftdiv { text-align: left; position : absolute; top: 0px; left: 20px; height: 50px; width: 33%; margin: auto; } .footer_middlediv { height: 50px; width: 33%; margin: auto; } .footer_rightdiv { text-align: right; position: absolute; top: 0px; right: 20px; height: 50px; width: 33%; margin: auto; }
what way make divs horizontal view vertical when minimizing browser using css? need divs become vertically when browser minimized , there not enough width see them horizontally.
thanks,
you can use media query achieve this. example have targeted 480 pixels.
@media , (max-width: 480px) { .footer_leftdiv, .footer_middlediv, .footer_rightdiv { width:100%; position:relative; text-align:left; left:0; } }
Comments
Post a Comment