Imaginemos el siguiente ejemplo:
h1 { margin: 1em 2em 3em 4em; }
La gente que comienza con CSS tiende a confundir o no recordar el orden de las medidas para las formas abreviadas.
Voy a comentar dos trucos para que sea fácil recordar dicho orden.
- TRouBLe (por Chris Coyier): La traducción vendría a ser «problemas, apuros, molestia», una buena forma de recordarlo. La letra mayúscula indica el orden T(top)R(right)ouB(bottom)L(left)e.
- Agujas de reloj: Mi forma preferida, creo haberla leído en algún libro. Simplemente tienes que pensar en el orden en el que se mueven las agujas del reloj: en punto (top), y cuarto (right), y media (bottom), menos cuarto (left). Este método también puede aplicarse a las formas simplificadas donde se omiten algunos valores.
- Reloj y Espejo: Si usamos formas simplificadas y omitimos valores, podemos seguir pensando en la dirección de las agujas del reloj y cuando omitamos un valor se obtendra su reflejo (efecto de espejo) tal cual comenta Javi.
Una paranoya de post… es más fácil verlo o imaginarlo que ponerlo con palabras 😛