Foros del Web » Creando para Internet » CSS »

problemas con galeria de imagenes maquetadas con CSS

Estas en el tema de problemas con galeria de imagenes maquetadas con CSS en el foro de CSS en Foros del Web. Hola chicos tengo un problema que me tiene loco, en realidad son varios pero primero lo primero: Estoy haciendo una galeria usando <div> en el ...
  #1 (permalink)  
Antiguo 05/11/2010, 14:36
Avatar de Walk3r  
Fecha de Ingreso: noviembre-2008
Ubicación: Barcelona
Mensajes: 22
Antigüedad: 9 años, 1 mes
Puntos: 0
problemas con galeria de imagenes maquetadas con CSS

Hola chicos tengo un problema que me tiene loco, en realidad son varios pero primero lo primero:
Estoy haciendo una galeria usando <div> en el HTML y asignandole los atributos en una hoja CSS; esta galeria se encuentra en una pagina con cabecera y con pie, y el problema que me tiene loco es que al usar "float:left;" para alinear las imagenes, el <div> contenedor de los <divs> que alojan las imagenes pierde todos sus atributos de alto y ancho y por supuesto el pie de la web se pega al logotipo de la cabecera y la galeria de imagenes se desborda pasandole por encima al pie de la pagina.

Ahora la pregunta es: Como alinear las fotos de la galeria 1 al lado de la otra siempre respetando el width y el height del div contenedor?

ESTE ES EL HTML:


<div class="galeria">
<div class="galeria-contenido"><a href="objetos/images/img1.png"><img src="objetos/thumbs/img1.png" alt="Ejemplo 1"><span style="color:green;"><br>1ra imagen</span></a></div>
<div class="galeria-contenido"><a href="objetos/images/img2.png"><img src="objetos/thumbs/img2.png" alt="Ejemplo 2"><span style="color:green;"><br>2ra imagen</span></a></div>
<div class="galeria-contenido"><a href="objetos/images/img3.png"><img src="objetos/thumbs/img3.png" alt="Ejemplo 3"><span style="color:green;"><br>3ra imagen</span></a></div>
<div class="galeria-contenido"><a href="objetos/images/img4.png"><img src="objetos/thumbs/img4.png" alt="Ejemplo 4"><span style="color:green;"><br>4ra imagen</span></a></div>
<div class="galeria-contenido"><a href="objetos/images/img5.png"><img src="objetos/thumbs/img5.png" alt="Ejemplo 5"><span style="color:green;"><br>5ra imagen</span></a></div>
<div class="galeria-contenido"><a href="objetos/images/img6.png"><img src="objetos/thumbs/img6.png" alt="Ejemplo 6"><span style="color:green;"><br>6ra imagen</span></a></div>
</div>



AQUI VA EL CSS


.galeria {width:800px; height:auto;
margin:10px;
padding:5px;
border:1px solid black;


}

.galeria-contenido {width:210px;
height:130px;
margin: 10px;
padding:5px;
background-color:#f5f7f9;
border-right: #a5a7aa solid 1px;
border-bottom: #a5a7aa solid 1px;
text-align:center;
display:block;
}







SOLO PUSE LA PARTE CSS que toca a la galeria.

pues espero sus respuestas que estoy al perder las neuronas
  #2 (permalink)  
Antiguo 05/11/2010, 15:01
Avatar de ArturoGallegos
Moderador
 
Fecha de Ingreso: febrero-2008
Ubicación: Morelia, México
Mensajes: 5.823
Antigüedad: 9 años, 9 meses
Puntos: 951
Respuesta: problemas con galeria de imagenes maquetadas con CSS

creo que lo que necesitas es aplicar un overflow en auto o hidden en los estilos del contenedor y en los estilos del pie de pagina aplica un clear:both

Código CSS:
Ver original
  1. .galeria {width:800px; height:auto;
  2. margin:10px;
  3. padding:5px;
  4. border:1px solid black;
  5. overflow:hidden;
  6. }
__________________
Toda ayuda se proporciona exclusivamente en el foro, no skype, no mensajes privados u otro medio....
  #3 (permalink)  
Antiguo 05/11/2010, 15:26
Avatar de Facundo_Nahuel  
Fecha de Ingreso: noviembre-2010
Ubicación: Buenos Aires, Argentina
Mensajes: 32
Antigüedad: 7 años, 1 mes
Puntos: 3
Respuesta: problemas con galeria de imagenes maquetadas con CSS

Código:
.galeria-contenido{
     width:210px;
     height:130px;
     margin: 10px;
     padding:5px;
     background-color:#f5f7f9;
     border-right: #a5a7aa solid 1px;
     border-bottom: #a5a7aa solid 1px;
     text-align:center;
     display:inline-block
}
  #4 (permalink)  
Antiguo 06/11/2010, 04:03
Avatar de Walk3r  
Fecha de Ingreso: noviembre-2008
Ubicación: Barcelona
Mensajes: 22
Antigüedad: 9 años, 1 mes
Puntos: 0
Respuesta: problemas con galeria de imagenes maquetadas con CSS

Pues problema resuelto muchas gracias chicos :D
usando clear:both y el overflow:hidden se soluciono el desborde.

Gracias nuevamente

Etiquetas: galeria, imagenes
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 08:39.