Div desplazado levemente en IE

[jabi]

Buenas a todos,

A ver si alguien me puede echar una mano con ésto, quizás sea sencillo pero no logro ver el motivo de lo que ocurre.

Comienzo poniendo una foto, una imagen vale más que mil palabras, ¿no?



Como se puede ver, el div de color verde aparece desplazado un pelín a la izquierda, no es que me vaya la vida en este detalle pero no comprendo por qué sucede ésto en IE (6 ó 7, en ambos) y en FF ó Chrome se ve perfectamente. Además ocurre únicamente cuando la ventana no está maximizada, si la maximizo se ve sin problemas.

Os pego el HTML de y los CSS que intervienen en todo esto.
La estructura se compone básicamente de una capa general (.principal), y dentro de ella una capa para la cabecera (.cabecera, que es la capa desplazada que nos ocupa), otra para el menú lateral con las secciones (.menu_izq), otra para el contenido central (.contenido) y una última para el pie de página (.pie):

HTML:

Código:

<div id="divPrincipal" class="principal">
    <div id="divCabecera" class="cabecera">
    </div>
    <div id="divMenuIzq" class="menu_izq">
    ........ contenido del menú ........
    </div>
    <div id="divContenido" class="contenido" runat="server">
    ........ datos sin importancia ........
    </div>
    <div id="divPie" runat="server" class="pie">
    ........ contenido del pie de página ........
    </div>
</div>

CSS:

Código:

body
{
	font-family: Verdana;
	font-size: 12px;
	outline: 0;
	margin: 0px;
	padding: 0px;
	background: #FFF url(../img/background2.jpg) repeat-y fixed center 50%;
}

.principal
{
	width: 800px;
	margin: 0 auto;
}

.cabecera
{
	width: 800px;
	height: 159px;
	margin-bottom: 10px;
	/*background: url('../img/img_cabecera2.jpg') no-repeat;*/
	background-color: #339966;
}

.contenido
{
	width: 650px;
	float: right;
	min-height: 450px;
	height:auto !important;
	height:450px;
}

.menu_izq
{
	width: 148px;
	float: left;
	margin-top: 6px;
	margin-left: 1px;
}

.pie
{
	width: 800px;
	clear: both;
	text-align: center;
	border-top: 1px solid #339966;
	padding: 2px 0px;
}

Estoy utilizando de background una imagen de dimensiones 840 x 2 px, la cual se repite por el estilo definido en body (repeat-y).

¿Alguna idea de por qué sucede ésto con IE?

Saludos, perdón por el testamento y gracias de antemano