problema en IE: desplazamiento de menu

[OrgasmUs]

Tengo un problema con IE (como no...),

el caso es que me muestra el menu horizontal unos pixeles desplazados hacia la derecha:

BIEN en FIREFOX/Win, OPERA/Win, IE/Mac, SAFARI/Mac:



MAL en IE/Win (IE 6.02XX) :



y eso que utilizo un css condicional para IE, pero no se donde está el error

Si alguien pudiera echarle un vistazo.... la URI es: http://faccion.es/webs/comex/

Aqui teneis el código de la sección "main-navigation" del CSS:

Código:

/* -------Main Navigation ---------- */
#main-nav { 
	height: 62px;
	margin-left: 361px;
	background: #317893 url(../images/fondo_menu.jpg);
	padding-left: 0px;
}

	#main-nav dl { 
		margin: 0; 
		padding: 0; 
	}

/* IE5 Mac Hack \*/ 
#main-nav { padding-left: 0px; }
/*/ 
#main-nav { padding-left: 0px; overflow: hidden; } 
/* End Hack */

	#main-nav dt { float: left; }
	
	#main-nav dt a {
		display: block;
		height: 0px !important;
		height /**/: 62px; /* IE 5/Win hack */ 
		padding: 62px 0 0 0;
		overflow: hidden;
		background-repeat: no-repeat;
		outline: none;
	}
	#main-nav dt a:hover {
		background-position: 0 -62px;
		outline: none;
	}
	
	body.empresa dt#empresa,
	body.empresa dt#empresa a,
	body.empresa dt#empresa a:hover,
	body.delegaciones dt#delegaciones,
	body.delegaciones dt#delegaciones a,
	body.delegaciones dt#delegaciones a:hover,
	body.productos dt#productos,
	body.productos dt#productos a,
	body.productos dt#productos a:hover,
	body.contacto dt#contacto,
	body.contacto dt#contacto a, 
	body.contacto dt#contacto a:hover {
		background-position: 0 -124px;
	}

	
	#main-nav dt#empresa,
	#main-nav dt#empresa a { width: 149px; background-image: url(../images/nav/empresa.gif); }
	
	#main-nav dt#delegaciones,
	#main-nav dt#delegaciones a { width: 148px; background-image: url(../images/nav/delegaciones.gif); }
	
	#main-nav dt#productos,
	#main-nav dt#productos a { width: 148px; background-image: url(../images/nav/productos.gif); }
	
	#main-nav dt#contacto,
	#main-nav dt#contacto a { width: 147px; background-image: url(../images/nav/contacto.gif); }

Gracias de antemano

[fer10]

prueba Borrando esto:

<div class="sinmargen">
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>

<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>

<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</div>

te recomendaria no usar capas con: position:absoulte, asi no tienes que poner &nbsp; para rellenar los espacios.

[OrgasmUs]

ya, pero si necesito posicionar un elemento determinado en una posicion exacta, y que varie relativamente al redimensionarse la ventana... ¿como hacerlo sin "position: absolute"?

Por otra parte, esa capa no tiene nada que ver, el problema está en "main-nav" (he probado a hacer lo que dices,pero obviamente no funciona, ya que no tiene nada que ver)

Ese exceso de &nbsp; solo tiene por funcion estirar hacia abajo la capa para conseguir el efecto faux-columns, es posioble que no esté bien hecho, y que deba hacerse de otra manera (mas que posible, seguramente), pero creo que no influye para nada en el problema de la seccion de main-navigation

[OrgasmUs]

Bueno, finalmente he conseguido encontrar el error, asi que lo cuento aqui, por si a alguien le ha ocurrido lo mismo alguna vez.

Todo radica en un bug de IE/Win, conocido como el gap de los 3 pixeles, lo teneis descrito (y su solución) en:

http://www.positioniseverything.net/...reepxtest.html

Asi que poniendole un height: 1%; al div que se iba de marras (main-nav) y un display: inline; se soluciona el tema

fer10 Tenias más razon que un santo, de hecho esos <p>&nbsp;</p> eran una atrocidad, lo que pasaba es que si quitaba ese <div class="sinmargen"> no me mostraba la imagen de fondo del sidebar, pero conseguí solucionar eso poniendole a ese div (el sidebar) un margin-bottom: auto y un padding-bottom= XXXpx;. Tu comentario me movió a quitarlo e ir probando. Gracias

Desde luego sobraba todo ese <p>&nbsp;</p>. Aún esta el codigo muy sucio (como los position: absolute) que hay que quitar, o el menu convertirlo en una lista, en lugar de usar dt y dl, pero poco a poco lo iremos arreglando

[epoj]

linda web, saludos!