Línea de tiempo para Recorrer una lista alineando los items a izquierda o derecha en función de su paridad
Licencia actual CC BY-SA 4.0
31 eventos
cuándo alternar formato | qué | por | licencia | comentario | |
---|---|---|---|---|---|
el 8 abr. 2020 a las 0:00 | auditar | Publicaciones de baja calidad | |||
el 10 abr. 2020 a las 13:43 | |||||
el 21 mar. 2020 a las 8:22 | auditar | Publicaciones de baja calidad | |||
el 21 mar. 2020 a las 8:22 | |||||
el 11 mar. 2020 a las 16:46 | comentario | añadido | Javi2EE | Dejo aquí el enlace a la nueva pregunta por si alguien se anima con alguna solución, espero que no quede muy repetitiva la cuestión: es.stackoverflow.com/questions/336312/… | |
el 11 mar. 2020 a las 16:44 | comentario | añadido | David E. Luna M. | @Javi2EE, fue muy importante tu aclaración y la de phpMyGuel. | |
el 11 mar. 2020 a las 16:42 | comentario | añadido | David E. Luna M. | @phpMyGuel Si, eso estuve viendo. De hecho, la respuesta es útil. Lo de par o impar pensé que tenía que ver con el DOM, pero no. Tienes razón en ello. De hecho, la voy a votar como útil. | |
el 11 mar. 2020 a las 16:39 | comentario | añadido | phpMyGuel |
@DavidE.LunaM. Parece que el OP le valió. Según entendí ese valor llega con el elemento y por lo que veo puede ser un valor numérico cualesquiera if(posicion%2 == 0) por eso supongo que lo divide entre 2 para saber si debe ir a la columna de la derecha o a la izquierda. En cualquier caso es lo que yo entendí y el OP no me lo desmintió XD. Y por lo que parece el blucle podría pintar de seguido varios elementos impares o varios pares, no contrapeados par-impar.
|
|
el 11 mar. 2020 a las 16:36 | comentario | añadido | David E. Luna M. | @phpMyGuel tienes razón en la parte que me has mencionado. Sin embargo, estoy leyendo bien la pregunta para entenderla mejor. Había entendido que el OP quería a la izquierda elementos pares y a la derecha elementos impares, de allí, la pseudoclase mencionada. | |
el 11 mar. 2020 a las 16:33 | comentario | añadido | phpMyGuel |
No entiendo a donde quieres llegar. La pseudo-clase nth-child hace referencia a elementos respecto a su posición dentro del DOM. Si eres capaz de sacarle provecho en el caso que se expone, que creo que mi HTML replica, estoy encantado de aprender de tu respuesta ^^
|
|
el 11 mar. 2020 a las 16:29 | comentario | añadido | Javi2EE | @DavidE.LunaM. Pero esto de par e impar es por un valor que traen estos elementos de la lista, y ese valor determina en que columna debe mostrarse, en este caso puede haber 15 elementos en la izquierda y ninguno a la derecha. Haciéndolo como comentas siempre habría el mismo número de elementos en la izquierda y la derecha. | |
el 11 mar. 2020 a las 16:28 | comentario | añadido | David E. Luna M. | Voy a leer de nuevo a ver. | |
el 11 mar. 2020 a las 16:28 | comentario | añadido | phpMyGuel |
@DavidE.LunaM. Creo que no estás entendiendo la problemática. Sustituye mi par e impar por un derecha e izquierda para entender de lo que te hablo. Donde los itemns izquierda deben ir a la primera columna y los derecha a la segunda.
|
|
el 11 mar. 2020 a las 16:26 | comentario | añadido | David E. Luna M. |
@phpMyGuel, lo menciono por los comentarios que hacía la persona que preguntaba. Es decir, las reglas .par {} e .impar {} reemplazarla por .item:nth-of-type(2n) {} y .item:nth-of-type(2n+1) {} , ya que él quiere formar dos columnas, donde los pares van a la izquierda y los impares a la derecha.
|
|
el 11 mar. 2020 a las 16:22 | comentario | añadido | phpMyGuel |
@DavidE.LunaM. Los de las clases .par e .impar es un requerimiento del OP. Este factor no lo marca su posición dentro del DOM, si no que cada item va a llegar con un valor (que puede ser par o impar) pudiendo darse el caso de que varios items pares vayan uno detrás del otro. (como puede verse en el HTML de mi respuesta).
|
|
el 11 mar. 2020 a las 16:19 | comentario | añadido | David E. Luna M. |
@phpMyGuel De hecho, he estado pensando responder a la pregunta, pero considero que tu respuesta está completa. Solo tienes que colocarle el selector que te indiqué en el comentario anterior. Una vez lo hayas hecho eliminaré estos comentaros. Me reservo +1 a la espera de lo pruebes y luego lo edites.
|
|
el 11 mar. 2020 a las 16:17 | comentario | añadido | David E. Luna M. |
@phpMyGuel, te tengo una propuesta para que tengas la respuesta completa. Independientemente de que utilices display:flex o display:grid a las reglas .item{} agrégale el selector :nth-of-type(2n) para indicar que seleccionas elementos pares y el resto a la derecha. Así solucionarías todo con independencia de que cambie de orden los elementos.
|
|
el 11 mar. 2020 a las 16:16 | comentario | añadido | quevedo | @Javi2EE Si en la nueva indicas en el título elementos de altura variable no habrá redundancia | |
el 11 mar. 2020 a las 16:10 | comentario | añadido | David E. Luna M. | Hola @Javi2EE, si hace la otra pregunta, hazla colocando un comentario señalando esta. | |
el 11 mar. 2020 a las 16:05 | votar | aceptar | Javi2EE | ||
el 11 mar. 2020 a las 16:05 | comentario | añadido | Javi2EE | Vale así lo haré si es lo correcto, era por evitar tener dos preguntas que van a ser prácticamente iguales y con casi el mismo titulo | |
el 11 mar. 2020 a las 16:02 | comentario | añadido | quevedo | Hola @Javi2EE si la respuesta responde a la pregunta inicial debieras dejarla como aceptada; eso ayudará a otros, y formular una nueva expresando en ella que la altura de las celdas debe ser variable. | |
el 11 mar. 2020 a las 15:52 | comentario | añadido | Javi2EE | Te pido disculpas por desaceptar esta respuesta de momento, lo hago para que mas gente pueda aportar, aunque en realidad respondía perfectamente a la pregunta inicial. | |
el 11 mar. 2020 a las 15:48 | votar | aceptar | Javi2EE | ||
el 11 mar. 2020 a las 15:52 | |||||
el 11 mar. 2020 a las 15:44 | comentario | añadido | Javi2EE | He aceptado esta solución porque en realidad responde perfectamente a la pregunta pero hay un problema con esta solución cuando la aplico al caso real, que viene de que no he sabido explicar bien el problema, se me olvidó decir que la altura de estos items puede ser variable ya que algunos de ellos despliegan otros campos en función de su valor. Amplío la pregunta añadiendo una imagen para que se entienda lo que digo. | |
el 11 mar. 2020 a las 15:28 | votar | aceptar | Javi2EE | ||
el 11 mar. 2020 a las 15:48 | |||||
el 11 mar. 2020 a las 15:09 | historial | editado | phpMyGuel | CC BY-SA 4.0 |
se añadieron 38 caracteres en el cuerpo
|
el 11 mar. 2020 a las 15:04 | historial | recuperada | phpMyGuel | ||
el 11 mar. 2020 a las 15:04 | historial | editado | phpMyGuel | CC BY-SA 4.0 |
se añadieron 223 caracteres en el cuerpo
|
el 11 mar. 2020 a las 14:57 | historial | editado | phpMyGuel | CC BY-SA 4.0 |
se añadieron 223 caracteres en el cuerpo
|
el 11 mar. 2020 a las 14:10 | historial | eliminada | phpMyGuel | mediante Voto | |
el 11 mar. 2020 a las 14:09 | historial | editado | phpMyGuel | CC BY-SA 4.0 |
se añadieron 223 caracteres en el cuerpo
|
el 11 mar. 2020 a las 13:58 | historial | respuesta | phpMyGuel | CC BY-SA 4.0 |