Problemilla con CSS

joanfp · #1 (**permalink**) 05/02/2009, 03:36

Hola a todos, tengo un pequeño problema con la pagina k estoy haciendo.
Si os fijais en las opciones de la div "menu" y a las de la div "footer" tienen una linea de 1px en la parte superior.
En la CSS he puesto un height: 1px pero es que si lo quito o pongo 0px me desaparecen las opciones.
Es curioso pq la imagen que se ve (el pixel este dichoso) corresponde a la imagen que tengo en la div "nav2", la de los 4 pasos a seguir que tienen rollover.

He conseguido hacerlo desaparecer poniendo el height:0px y reposicionando el margin-left: de las opciones pero entonces en IExplorer se ven todos fuera de sitio y en Mozilla todo correcto

¿Alguien sabe como hacer desaparecer este maldito pixel que se ve, y que se vea todo bien en los navegadores, mozilla y explorer?.

Os paso el link:
www.videobodasbcn.com

Gracias a todos de nuevo!!!!!!!.

willyfc · #2 (**permalink**) 05/02/2009, 07:44

pruebalo de esta manera

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<style type="text/css">
#menu {position: absolute;}
#menu ul { list-style:none}
#menu ul li { display:inline; color:green;font: 11px verdana;}
#menu li a{ color:#332620; text-decoration: none; padding:0 7px 0 7px;}
#menu li a:hover, #menu li a:focus, #menu li a:active { color: #bb3333;}
</style>
</head>

<body>
<div id="menu"> 
		 			<ul> 
		 		 			<li><a href="#">Nuestros servicios</a></li> 
				 			<li><a href="#">¿Y dónde estamos?</a></li> 
				 			<li><a href="#">Visita nuestro blog</a></li> 
				 			<li><a href="#">Inicio</a></li> 
		 			</ul> 
		 </div> 
</body>
</html>
33;}

ahora cuadra las medidas a tu diseño. con los margenes que tenia.

joanfp · #3 (**permalink**) 06/02/2009, 02:42

Cita:

Iniciado por willyfc

pruebalo de esta manera

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<style type="text/css">
#menu {position: absolute;}
#menu ul { list-style:none}
#menu ul li { display:inline; color:green;font: 11px verdana;}
#menu li a{ color:#332620; text-decoration: none; padding:0 7px 0 7px;}
#menu li a:hover, #menu li a:focus, #menu li a:active { color: #bb3333;}
</style>
</head>

<body>
<div id="menu"> 
		 			<ul> 
		 		 			<li><a href="#">Nuestros servicios</a></li> 
				 			<li><a href="#">¿Y dónde estamos?</a></li> 
				 			<li><a href="#">Visita nuestro blog</a></li> 
				 			<li><a href="#">Inicio</a></li> 
		 			</ul> 
		 </div> 
</body>
</html>
33;}

ahora cuadra las medidas a tu diseño. con los margenes que tenia.

Gracias WillyFC ya está solucionado!!!!!!!!.

joanfp.

willyfc · #4 (**permalink**) 06/02/2009, 07:12

de nada, para eso estamos