Hoy encontré un artículo bastante interesante de una de las cosas que se nos trae CSS 3. El artículo original en inglés es de Peter Gasston. Me ha parecido tan interesante que he decidido hacer una traducción.

La dificultad a la que muchos desarrolladores hacen frente cuando comienzan con la maquetación de websites sin tablas es conseguir la disposicion de los elementos para que funcionen. Floats y posicionamientos son bastante fáciles para estructuras básicas, pero empiezan a ser increíblemente complejos cuando vas a un nivel más avanzado. Cuando el impacto de las CSS se intensificó, el problema era -y es- que las tablas siguen siendo mucho más convenientes en muchos casos, y hay veces en las que no hay alternativa decente sin contradecirte; no puedes usar display:table porque no lo soporta IE.

Una interesante solución es el CSS3 Advanced Layout Module (Módulo de Estructura Avanzado en CSS3).

Funciona así: Imagina que tienes una lista con cuatro elementos:

<li id="one">One</li>
<li id="two">Two</li>
<li id="three">Three</li>
<li id="four">Four</li>

Utilizando la declaración display o display-model, podrías colocar los elementos en una cadena tal y como aparecerían en pantalla:

ul {
display-model: "ab"
               "cd";
}

Y entonces asignamos un orden a los elementos hijos usando position:

li#one { position: a; }
li#two { position: b; }
li#three { position: c; }
li#four { position: d; }

Para estructurar los elementos li en forma de cuadrado sin usar floats y márgenes; he replicado el cómo sería usando una tabla.

One Two
Three Four

De forma alternativa, podríamos usar los mismos cuatro elementos para una distribución distinta:

ul {
display-model: "aa"
               "bc"
               "dd";
}

li#one { position: a; }
li#two { position: b; }
li#three { position: c; }
li#four { position: d; }
One
Two Three
Four

Útil no? Es mucho más flexible que los ejemplos básicos mostrados aquí, y podríamos ahorrarnos en el futuro una cantidad de tiempo tremenda.

¿La desventaja? Hasta ahora solo está disponible como boceto y solamente ha sido asignado una prioridad media por la W3C. Añadiendo que el tiempo extra que tardan los navegadores en implementarlos, y no lo veremos muy pronto.

Artículo Original (Inglés)