This is me just being obsessive but I have to know if there is an explanation for this behavior. I have a monitor with a 1280 X 1024 viewport. I have a site that I want centered on the page. I also want the site width to be 1280 pixels wide.Now, with FF and Opera, I can set the body to 100% and my wrapper to 1260px (Accounting for the scrollbar) and I do not get a horizontal scrollbar. If I use IE7 or 8, I get a horizontal scrollbar.FF and Opera calculate the body width at 1260px (Assuming a 17px scrollbar) while IE calculates it at 1259px. I've measured the scrollbar in IE and it's also 17px.Why is this?This is it...\[code\]@import url("reset.css"); <- Erik Meyers resethtml, body{ width:100%; background:#ccc; font-size:100%; /**overflow-x:hidden;**/ <-- Works fine with overflow-x:hidden font-family:Arial;}#wrap-page{ margin:auto; width:1263px;}#wrap-content{ margin:0 5px;}<!DOCTYPE html><html> <head> <title></title> </head> <body> <div style="wrap-page"> <div style="wrap-page"> <div style="float:left;height:2000px;width:1263px;">The test</div> <div style="clear:both;"></div> </div> <div style="clear:both;"></div> </div> </body></html>\[/code\]
Why is a minus 4 pixel difference on body width in IE
- Thread starter c400s
- Start date