Mira bajo la superficie
Esto se podría realizar de una manera mucho más simple. | Adivina ¿cuánto pesa el marcado de esta pequeña tabla? 13,7k. Cuenta con 17 filas y 9 columnas. ¿Y mencioné todos los espaciadores GIF? | ||||||||||||
Podemos ver muchas celdas de tablas y espaciadores aquí. | Y todos los márgenes con puntos están hechos con un atributo de fondo en las celdas de las tablas, los cuales no serán validados.
| ||||||||||||
Todo esto se podría realizar con 8 celdas de tablas y con 4 reglas de CSS. | De verdad, todo lo que se necesita son 8 celdas y 4 reglas de CSS.
| ||||||||||||
Necesitas una regla para <table>, otra para <td>, otra para <ul> y otra para <li>. | Eso es todo. Una vez que las tienes, lo has logrado.
| ||||||||||||
El código que muestra la estructura de la tabla:
table{ margin:3px; padding:2px; border:solid 2px blue }
td{ padding:2px; border-style: solid; border-width: 1px; border-color:gray gray silver silver }