CSS - Propiedades, display y Modelo de caja

Propiedades

Displays clásicos

• inline
• inline-block
• block
• none

Merecen su propio capítulo

• flex
• grid

Hay más, pero los podéis ignorar excepto para casos muy especiales.

• list-item
• table
• table-row
• table-cell

Modelo de caja

Para los block e inline-block

Los valores de margin, padding, y en general de las propiedades, se aplican en orden horario.

Al final, el tamaño se calcula con la suma de todos ellos ejemplo

margin: top right bottom left // margin: 1rem 2rem 1rem 2rem, si son iguales de 2 en 2 o los 4 se puede simplificar margin: 1rem 2rem, margin: 1rem

Listado de TODAS las propiedades