DIV moves 1px on page zoom

Question

I have a fixed header on my site that I'm working on. So the content of my page flows under the header and the header stays fixed at the top of the page. I can't use the border-radius function in css to create my rounded corners that I want because the page content background color shows on the outside of my rounded corners. So I have implemented two rounded corner images, one for the left and one for the right. My problem is, the images move a total of 1px when I zoom. No matter how much I zoom, it only moves a total of 1px and for the life of me, I can't seem to figure out the problem. I'm going to post a link to my site and maybe somebody can go through the html and css and try to figure this out. I also put a link to download my VB project to look at in Visual Studio. Any help would be appreciated thanks a lot.

Link to Webpage http://aspspider.info/speeddemon8406/Default.aspx

Link to download VB project http://www1.datafilehost.com/d/46288e83

Answer 1

#header {
  background-color: #ddd;
  height: 125px;
  left: 50%;
  margin-left: -480px;
  position: fixed;
  width: 960px;
}
#header-top {
  background-color: #fff;
  border-left: 1px solid #aaa;
  border-radius: 25px 25px 0 0;
  border-right: 1px solid #aaa;
  border-top: 1px solid #aaa;
  height: 85px;
  width: 958px;
}
#nav-wrapper {
  background-color: #fff;
  border-left: 1px solid #aaa;
  border-right: 1px solid #aaa;
  width: 958px;
}
#nav {
  background-color: Orange;
  border-radius: 15px 15px 0 0;
  height: 40px;
  margin: 0 1px;
  width: 956px;
}

#topleftcorner,#toprightcorner,#nav-corner-left,#nav-corner-right{display:none;}

The basic idea is that I put a #ddd color on #header (the page background color). I then use border-radius on #header-top to round the corners. I also apply a white background to #nav-wrapper. Then I just fix up the borders, and remove the unnecessary images.

As for your 1px off problem, it's a rounding error. I removed left:0;right:0 from #header and replaced it with left:50%;margin-left: -480px so that it doesn't happen.