\[code\]**html**<html><head><link rel="stylesheet" href="http://stackoverflow.com/questions/10552865/style.css" ... /></head><body><div id="wrapper"> <div id="header"><div id="comcast"><img src=http://stackoverflow.com/questions/10552865/Desert.jpg width="18px" height="40px"></img></div><div id="menu"><img src=http://stackoverflow.com/questions/10552865/Hydrangeas.jpg width="48px" height="40px"></img></div></div> <div id="content"> <div id="content-left"><img src=http://stackoverflow.com/questions/10552865/Desert.jpg width="180px" height="1000px"></img></div> <div id="content-main"><img src=http://stackoverflow.com/questions/10552865/Hydrangeas.jpg width="700px" height="1000px"></img></div> </div> <div id="footer"></div> <div id="bottom"></div></div></body></html>**css**body { font-family:arial,helvetica,sans-serif; font-size:12px; }#wrapper { margin:0px auto; border:1px solid #bbb; padding:10px; }#header { border:1px solid #bbb; height:80px; padding:10px; } #content { margin-top:10px; padding-bottom:10px; } #content div { padding:10px; border:1px solid #bbb; float:left; } #content-left { width:180px; } #content-main { margin-left:10px; width:700px; } #footer { float:left; margin-top:10px; margin-bottom:10px; padding:10px; border:1px solid #bbb; width:878px; } #bottom { clear:both; text-align:right; }*{margin:0px; }#menu{float:right;}\[/code\]The problem is if i do zoomin or zoomout content left and content main div are jumbling.My requirement is if we do zoom in or zoom out the contentleft and contentmain it should shrink as such and it should not be jumbled.How can i achieve this.
zoom in and zoom out problems in html page
- Thread starter mer
- Start date