Problemas de visualizacion en el Explorer

[Bytevamp]

Hola, ya se que debe ser una tonteria pero ,..., a veces lo mas tonto es lo mas dificil(al menos cuando tienes poca idea de CSS como es mi caso), tengo la siguiente pagina: http://www.bytevampsoft.com/fotossesions/ , en Firefox se ve bien, pero en el Explorer los cuadros de buscar, e-mail, usuario y contraseña se desvian bastante, he intentado colocar el cuadro buscar, pero no hay forma, se me pone al principio del div buscar, y no en su posicion, el codigo(para que quede un poco mas claro) es:

Código HTML:

<div id="menu">	
	<img src="./imagenes/menu.gif" border="0" usemap="#Mapa" alt="Mapa" />	
	<map name="Mapa" id="Mapa">
		<area shape="rect" coords="3,5,50,25" href="./index.php" alt="inicio" />
		<area shape="rect" coords="50,5,150,25" href="./fotossesions.php" alt="Fotossesions" />
		<area shape="rect" coords="150,5,225,25" href="./productos.php" alt="Productos" />
		<area shape="rect" coords="225,5,330,25" href="./contratacion.php" alt="Contratacion" />
		<area shape="rect" coords="330,5,400,25" href="./contacta.php" alt="Contacta" />
		<area shape="rect" coords="400,5,475,25" href="./prensa.php" alt="Prensa" />
	</map>
	<div id="buscar">
		<form name="buscar" method="post" enctype="application/x-www-form-urlencoded" action="buscar.php">
			<input type="text" name="buscar" onkeydown="Enviar();" value="Buscar" class="texto-buscar" size="24" />&nbsp;
		</form>
	</div>
</div> 

Para Firefox, el CSS es:

Código HTML:

#menu
{
	width:878px; 
	height:28px; 
	margin:0 auto 0 auto;	
	top:150px; 
	z-index:1;
	
}

#buscar
{
	text-align:right;
	width:873px; 
	height:28px; 
	top:147px;	
	position:absolute;
	z-index:1;	 
}

este funciona bien, el que no me va es el del Explorer que es:

Código HTML:

#menu
{
	width:878px; 
	height:28px; 
	margin:0 auto 0 auto;	
	top:150px; 
	z-index:1;
	
}

#buscar
{
	left:705;
	top:-50px;	
	position:relative;
	z-index:2;	 
}

Decir, que tal y como recomendaron por un post anterior, en lugar de usar Hacks para el explorer uso condicionales para cargar uno u otro css, de la siguiente forma(por si es relevante):

Código HTML:

<!--[if IE]>
	<link href="./stylos/ie.css" rel="stylesheet" type="text/css" />
<![endif]-->
<!--[if IE]><![if !IE]><![endif]-->
	<link href="./stylos/estilos.css" rel="stylesheet" type="text/css" />
<!--[if IE]><![endif]><![endif]--> 

Gracias por la ayuda.

Saludos.

[dario-g]

que tal, usas demasiados div de tamaño absoluto y de tamaños muuuy grandes, prueba combinando divs relativos con absolutos, asi por ejemplo si el contenedor lo pones relativo, y dentro usas para la parte de buscar que lo ponga posicionamiento "absolute" y agregas a 2px de la derecha, funcionara correctamente es decir se posicionara con respecto al contenedor, repito si especificas "relative", tambien te puede serviro coolocar divs relativos y que sean flotantes.
Adicionalmente quisa en el menu preferirias usar una lista, o bien sencillos enlaces <a> con su respectivo hover, y en el id menu especificas la imagen de fondo, esto debido a que seria combeniente usar fuentes relativas en unidades em, en lugar de imagenes, si la resolucion de pantalla es muy grande las letras se ven mas pequeñas,,, esto unicamente como sugerencia

[Bytevamp]

Gracias dario-g, esa era la solucion

Código HTML:

#menu
{
	position:relative;
	width:878px; 
	height:28px; 
	margin:0 auto 0 auto;		 
	z-index:1;
	
}

#buscar
{
	left:732px;		
	top:2px;
	position:absolute;
	z-index:1;	 
}

Asi lo hice al final, respecto a lo del menu,..., para la version 2.0.

Gracias por la ayuda.