Foros del Web » Creando para Internet » CSS »

Even y odd no funcionan

Estas en el tema de Even y odd no funcionan en el foro de CSS en Foros del Web. Hola! Tengo dos columnas de imágenes que se cargan dinámicamente. A esas imágenes les he dado un ancho fijo, de manera que las dos columnas ...
  #1 (permalink)  
Antiguo 08/05/2013, 04:45
 
Fecha de Ingreso: septiembre-2012
Mensajes: 5
Antigüedad: 12 años, 3 meses
Puntos: 0
Pregunta Even y odd no funcionan

Hola! Tengo dos columnas de imágenes que se cargan dinámicamente.
A esas imágenes les he dado un ancho fijo, de manera que las dos columnas tienen exactamente el mismo ancho, pero la altura de dichas imágenes es variable.

La idea es que no haya clear de una columna con respecto a otra, me explico: quiero esto:


Y lo consigo con todas las imágenes excepto con una:


Éste es el código HTML y PHP:

Código HTML:
<div id="tS">
<a href="presentacion.php?id=<?php echo $id2 ?>&pag=<?php echo $_GET['pag'] ?>#<?php echo $id2 ?>">
       <img src="../../img/<?php echo $img ?>" />
        <span><?php echo $subtitulo ?></span>
</a>
</div> 
Y éste el CSS:
Código:
#tS {
	position:relative;
	top:20px;
	width:830px;
}

#tS a {
	display:block;
	width:400px;
	font-size:11px;
	color:#999;
	text-decoration:none;
	margin-right:30px;
}

#tS a:nth-child(odd) {
	float:left;
	clear:left;
}

#tS a:nth-child(even) {
	margin-right:0 !important;
	float:right;
	clear:right;
}

#tS a span {
	display:block;
	width:400px;
	margin:5px 0 10px 0;
	text-align:center;
}

#tS img {
	width:400px;
}
Sabéis qué puede ocurrir?
Gracias.
  #2 (permalink)  
Antiguo 08/05/2013, 08:02
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años, 4 meses
Puntos: 2114
Respuesta: Even y odd no funcionan

Como bien dice el título, en cualquier caso para que funcione tendrías que poner los selectores de esta forma:

Código CSS:
Ver original
  1. #tS:nth-child(odd) a
  2. #tS:nth-child(even) a

Tal como lo tienes, estás diciendo que seleccione los enlaces pares o impares que están dentro de #tS, y al haber sólo uno, siempre aplicaría odd —impar.

Que no sé si será ese el problema o no, porque el HTML que aportas es escaso. Con la misma cada enlace es el elemento en si.

De todas formas, yo para cosas así, como aún no he conseguido hacerlo mediante CSS totalmente dinámico, siempre recurro a usar un plugin para jQuery:masonry

Última edición por pzin; 08/05/2013 a las 08:08
  #3 (permalink)  
Antiguo 08/05/2013, 08:27
 
Fecha de Ingreso: septiembre-2012
Mensajes: 5
Antigüedad: 12 años, 3 meses
Puntos: 0
Respuesta: Even y odd no funcionan

Gracias pzin, pero me temo que he tratado de limpiar tanto el código para mostrarlo que no ha quedado claro que genera un enlace por cada imagen, que la contiene, no un enlace que contiene a todas las imágenes.

Gracias por la idea del jQuery, me gustaría tratar de evitarlo pero como última opción...

Etiquetas: ancho, color, funcionan, html, imagenes, php
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 17:27.