I am currently developing a site www.zarsource.com I am unable to remove a white space on the image sometimes it appears of the right some times to left depending on the browser. Please advice how to I get rid of it.

Any type of help and guidance will be much appareciated.

Vishal Khialani

Controlling page layout's in different browsers is a big mess, but you can apply some workaround to get over it...

Here's a simple layout sample, which you can run for testing:
Assuming that you have the following layout order.

<title>Site Title</title>
<style type="text/css">
body { background-color : #fff; }
div {
  background-color : #ccc;
  border : 1px solid #000;
  min-height : 100px;
  margin : 0;
  padding : 0; }

div#wrapper {
  margin : 0 auto;
  min-width : 974px;
  width : 100%; }

/* The image background rules example */
div#main {
  background : transparent url(final1.jpg) no-repeat center top;
  clear : both;
  margin : 0 auto;
  height : 309px !important;
  overflow : hidden;
  max-height : 309px;
  max-width : 974px;
  width : 974px !important; }
<div id="wrapper">
<div id="header"><!-- 01 --></div>
<div id="main"><!-- 02 --></div>
<div id="footer"><!-- 03 --></div>

try to run the whole document in different browsers and see how the layout worked, if its still having the same slipped with the white-spaces.

Thank you everyone for your help. I was able to solve the problem from the pointers I got from you all.