Hola querida comunidad!
Me ha surgido un interrogante que no logro encontrar por ningún lado. Resulta que estoy creando una página que se carga con contenido en una base de datos, es decir, es dinámica, según sea el contenido de la base de datos y mediante php le digo que opte por agruparse de las tres maneras siguientes según sea el resultado:
DIV 1:
<div style="position: relative; float: left; width: 200px; height: 150px; backround-image: url(
imagen_bbdd);">
texto base de datos
</div>
DIV 2:
<div style="position: relative; float: left; width: 300px; height: 150px;">
<div style="position: relative; float: left; width: 200px; height: 150px; backround-image: url(
imagen_bbdd);">
</div>
<div style="position: relative; float: left; width: 100px; height: 150px;">
texto base de datos
</div>
</div>
DIV 3:
<div style="position: relative; float: left; width: 300px; height: 150px;">
<div style="position: relative; float: left; width: 300px; height: 100px; backround-image: url(
imagen_bbdd);">
</div>
<div style="position: relative; float: left; width: 300px; height: 50px;">
texto base de datos
</div>
</div>
Ahora bien, mi problema es que esto se me esta haciendo algo complicado, aunque aquí lo he puesto fácil tiene un trasfondo más complejo. Mi pregunta es:
¿Hay alguna forma de hacer esa agrupación al estilo de lo siguiente?:
//muestra todas las capas DIV 1 pero con una sola etiqueta
<etiqueta DIV 1
imagen_bbdd>
texto base de datos
</etiqueta>
//muestra todas las capas DIV 2 pero con una sola etiqueta
<etiqueta DIV 2
imagen_bbdd>
texto base de datos
</etiqueta>
//muestra todas las capas DIV 3 pero con una sola etiqueta
<etiqueta DIV 3
imagen_bbdd>
texto base de datos
</etiqueta>
Gracias y un saludo.
PD: lo he puesto en CSS porque creo que es la base de mi problema, pero estaría igualmente agradecido si, en el caso de que no se pudiera hacer con css, pudieran darme una solución en javascript.