I am experiencing a problem with a site I am developing which relies upon a centred background image (750 x 1, repeat-y). When I place the banner graphic atop this background IE renders incorrectly with the image appearing to be 1 pixel left of where it should be.
Am I coding it wrongly (XHTML / CSS below)? Or is there a hack I need to use? THANKS :) Bryan SOURCE: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";> <html lang="en"> <head> <title>Joy and Pete Consulting</title> <link rel="stylesheet" type="text/css" href="style.css" /> </head> <body> <div id="container"> <div id="banner"><img src="images/banner.jpg" alt="Joy and Pete Consulting" title="Joy and Pete Consulting" /></div> </div> </body> </html> CSS SOURCE: * { margin: 0px; padding: 0px; } body { margin: 0; background-color: #efefef; background-image: url(images/background-lines.gif); background-position: center; background-repeat: repeat-y; font-size: 0.8em; font-family: Arial, Helvetica, Sans-Serif; } h1, h2, h3, h4, h5, h6 { margin-top: 1em; margin-bottom: 1em; font-weight: bold; color: #254D81; } a { text-decoration: none; } #container { width: 750px; margin: 0 auto 0 auto; } ****************************************************** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help ******************************************************
