</> CodeBooks
    ← Volver a CSS (página 4)
    Portada de Table Layout in CSS

    Table Layout in CSS

    Eric A. Meyer

    Editorial
    O'Reilly
    Año
    2016
    Páginas
    ~44
    Nivel
    Intermedio

    De qué trata

    Pequeña monografía de Eric A. Meyer que explica cómo CSS dispone y dibuja las tablas, y no cómo usar tablas para maquetar páginas. Es un extracto de la cuarta edición de «CSS: The Definitive Guide» y describe el modelo de tablas de CSS 2.1 tal como lo implementaban los navegadores en 2016. Está dirigida a desarrolladores front-end de nivel intermedio que ya dominan el modelo de cajas y quieren entender con precisión por qué una tabla se comporta como lo hace.

    El contenido se organiza en tres bloques. El primero trata el formateo: las reglas para ordenar visualmente una tabla, los valores de display propios de las tablas (table, table-row, table-cell, table-column…), la primacía de las filas sobre las columnas, los objetos de tabla anónimos que el navegador inserta cuando falta algún elemento, las capas de la tabla y los títulos (caption). El segundo trata los bordes de las celdas: el modelo de bordes separados, con border-spacing y el manejo de celdas vacías, y el modelo de bordes colapsados, con las reglas que deciden qué borde gana cuando dos se juntan. El tercero trata el tamaño: el cálculo del ancho con table-layout fixed frente a auto, el cálculo de la altura y la alineación del contenido de las celdas.

    Es un texto de referencia sin ejercicios ni proyectos, útil sobre todo para quien maquete tablas de datos complejas o use display: table para imitar su comportamiento. Su principal limitación es el alcance: hoy Flexbox y Grid cubren la mayoría de los casos de maquetación, y el libro no habla de tablas responsivas ni de accesibilidad. Aun así, sus explicaciones sobre los bordes colapsados y el algoritmo de anchos automáticos son difíciles de encontrar con este nivel de detalle.

    • Tablas CSS
    • display: table
    • Objetos anónimos
    • Capas de tabla
    • border-collapse
    • border-spacing
    • table-layout
    • Tamaño de tablas
    • Alineación de celdas

    ¿Cómo enseña?

    TeóricoPráctico

    Teórico

    • ✗ Sin ejercicios
    • ✗ Sin proyectos

    Más de CSS con nivel Intermedio