En 1-Line Layouts hay diez estupendas plantillas en CSS para conseguir mediante técnicas «modernas» (CSS Grid y flexbox entre principalmente) algunos de los efectos más clásicos de los diseños de páginas HTML+CSS con suma elegancia.

Los ejemplos van desde el supercentrado en horizontal y vertical para un «algo» dentro de una caja al clásico diseño de cabecera + cuerpo + pie, o el que llaman Santo Grial en el que el cuerpo tiene además un lateral derecho e otro izquierdo y algunas técnicas más para múltiples columnas, imágenes y vídeos que mantengan las proporciones y cosas así.

La autora de esta pequeña maravilla es Una Kravets, que trabaja en temas de CSS y desarrollo web en Google. ¡Ah! Y aunque el título habla de CSS de una sola línea los ejemplos tienen varias, aunque técnicamente podría escribirse todo en una sola línea, claro. Pero sería menos legible y elegante.

(¡Gracias Quenrapu por la pista!)

Relacionado:

Los tutoriales de Layout Land: técnicas CSS Grid y Flexbox
Trucos de rediseño de interfaces de usuario
Diez consejos rápidos a la hora de crear diseños e interfaces de usuario
El diseño de tablas en la web desde el punto de vista tipográfico
34 mitos sobre diseño web y experiencia de usuario
Un billete de tren diseñado al completo con CSS Grid
Tendencias del diseño web para 2019
Slick: el carrusel definitivo en HTML/CSS/jQuery
Type Anything: una forma simple de maquetar tipográficamente una web
Un tutorial animado de Flexbox
El arte del diseño web

# Enlace Permanente