Foros del Web » Creando para Internet » CSS »

Listas flotantes no flotan como deberia

Estas en el tema de Listas flotantes no flotan como deberia en el foro de CSS en Foros del Web. Estoy intentando hacer una galería de imágenes según el código sacado de http://www.webtaller.com/construccio....php?bol0307-2 y estoy intentando que al poner el ratón encima de la imagen, ...
  #1 (permalink)  
Antiguo 15/04/2009, 09:26
 
Fecha de Ingreso: julio-2007
Mensajes: 62
Antigüedad: 10 años, 5 meses
Puntos: 0
Listas flotantes no flotan como deberia

Estoy intentando hacer una galería de imágenes según el código sacado de http://www.webtaller.com/construccio....php?bol0307-2 y estoy intentando que al poner el ratón encima de la imagen, esta se vea un poquito más grande, sin embargo, al hacer el zoom, los elementos de la siguiente linea flotan a partir de este, por lo que salen descuadrados, ¿como puedo arreglar eso?

Código PHP:
<head>
<
meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<
title>Documento sin t&iacute;tulo</title>
</
head>
<
style type="text/css">
#principal li {
   
displayinline;
   
floatleft;
   
width220px;
   
background-color#f5f7f9;
   
padding5px;
   
margin20px;
   
text-aligncenter;
   
border-right#a5a7aa solid 1px;
   
border-bottom#a5a7aa solid 1px;
}
#principal li img {
    
width220px;
}
#principal li:hover,
#principal li:hover img{
    
width300px;
}
#principal li a {
    
displayblock;
}
</
style>
<
body>
<
div id="principal">
    <
h3>GALERÍA CSS Listas</h3>
    <
ul>
        <
li><a href="#"><img src="img/1.jpg" border="0" alt=""/><br /><span>Descripción de la imagen</span></a></li>
        <
li><a href="#"><img src="img/1.jpg" border="0" alt=""/><br /><span>Descripción de la imagen</span></a></li>
        <
li><a href="#"><img src="img/1.jpg" border="0" alt=""/><br /><span>Descripción de la imagen</span></a></li>
        <
li><a href="#"><img src="img/1.jpg" border="0" alt=""/><br /><span>Descripción de la imagen más larga de lo habitual</span></a></li>
        <
li><a href="#"><img src="img/1.jpg" border="0" alt=""/><br /><span>Descripción de la imagen</span></a></li>
        <
li><a href="#"><img src="img/1.jpg" border="0" alt=""/><br /><span>Descripción de la imagen</span></a></li>
        <
li><a href="#"><img src="img/1.jpg" border="0" alt=""/><br /><span>Descripción de la imagen</span></a></li>
        <
li><a href="#"><img src="img/1.jpg" border="0" alt=""/><br /><span>Descripción de la imagen</span></a></li>
        <
li><a href="#"><img src="img/1.jpg" border="0" alt=""/><br /><span>Descripción de la imagen</span></a></li>
        <
li><a href="#"><img src="img/1.jpg" border="0" alt=""/><br /><span>Descripción de la imagen</span></a></li>
        <
li><a href="#"><img src="img/1.jpg" border="0" alt=""/><br /><span>Descripción de la imagen</span></a></li>
    </
ul>
</
div>
<
br style="clear: both;" />
</
body
</
html
  #2 (permalink)  
Antiguo 15/04/2009, 13:26
 
Fecha de Ingreso: julio-2007
Mensajes: 62
Antigüedad: 10 años, 5 meses
Puntos: 0
Respuesta: Listas flotantes no flotan como deberia

He conseguido que funcione bien en Firefox utilizando los selectores avanzados, sin embargo Internet Explorer no lo usa bien, y no se como arreglarlo.
He introducido el siguiente estilo:
Código PHP:
#principal li:hover + li {
    
clearboth;

¿a alguien se le ocurre algo?
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 16:10.