Un mnemónico para el orden de las propiedades abreviadas de margen y relleno de CSS

85

Nunca puedo recordar el orden de la propiedad abreviada para establecer el margen o el relleno en una declaración. Es decir:

margin-top:    2px;
margin-bottom: 4px;
margin-left:   3px;
margin-right:  8px;

puede escribirse como

margin: 2px 8px 4px 3px;

Sí, entiendo que uno puede visualizar el orden pensando en un reloj, comenzando al mediodía y moviéndose en el sentido de las agujas del reloj. Pero sigo olvidándome de eso. Necesito recordar el orden superior, derecha, inferior, izquierda textualmente.

Por lo tanto, TBLR TRB L.

Algo como Este [R-sustantivo] [B-verbo] [L-sustantivos] es quizás el camino a seguir, pero siento que me falta inspiración. Si alguien ha encontrado un mnemónico útil para esto, me encantaría escucharlo. Como un buen meme, estoy seguro de que una vez que tenga algo alojado en mi cerebro, es poco probable que lo olvide.

NOTA : Esta pregunta proporcionó información incorrecta; el orden (como se indica en algunos de los comentarios y respuestas) es Arriba a la derecha Abajo a la izquierda . (je, ves a lo que me refiero? - dland)

dland
fuente
21
es FALLO, que realmente hacer tener problemas para recordar que
a pesar
10
Esto es excesivo para cualquiera que esté familiarizado con los relojes analógicos. Las abstracciones como las palabras y los acrónimos no son naturales para la mente humana, recordar FALLA y luego convertir manualmente cada letra en una orientación física hace la vida más complicada de lo que necesita ser en mi opinión. Es mucho mejor recordar el orden visualmente, después de todo estás trabajando en un medio visual en este contexto: D.
mahemoff
2
También conviene recordar lo que sucede si solo se dan dos o tres valores. Por ejemplo, "margin: 3em 5em;" y "margen: 3em 5em 6em;". En el primero, se usa 3em para la parte superior e inferior, y 5 para los lados izquierdo y derecho. En el segundo, 3 para arriba, 5 para izquierda y derecha, y 6 para abajo. Supongo que es fácil recordar lo que sucede si solo se da un valor.
Harry Pehkonen
2
Me encantan las respuestas, pero esta tiene que ser la pregunta más ridícula solo por la forma en que la abordas. Me perdiste por completo con los sustantivos y los verbos. Es una caja, pon un reloj en ella y termina con ella.
Eric Bishard

Respuestas:

175

Si no lo hace bien, habrá PROBLEMA

Paul Dixon
fuente
7
No hay problema para recordar si quita las vocales
zzapper
5
@zzapper: OUch --- EEEks. Me equivoqué y eliminé las consonantes.
Yaakov Belch
css-tricks.com/…
Ryan Williams
76

En realidad, el reloj funciona perfectamente. Es la forma más intuitiva de recordarlo, al menos para mí.

Yuval Adam
fuente
1
Y también funciona pictóricamente ... la mayoría de las veces, vas a pensar en líneas visuales de todos modos.
Armstrongest
25

¿Lógica de borde de rectángulo complicado?

Paul Dixon
fuente
1
No había escuchado eso antes, pero me gusta :)
Adam Rezich
21

¿Por qué no recuerdas que el orden va en el sentido de las agujas del reloj comenzando desde ARRIBA?

ARRIBA -> DERECHA -> ABAJO -> IZQUIERDA

Steve
fuente
15

Otro intento:

Tyrannosaurus Rex: gran lagarto

Paul Dixon
fuente
12

Piense en el sentido de las agujas del reloj, es la forma más fácil. Empieza por arriba y va dando vueltas ... mucho más fácil de recordar que una frase tonta (siempre que sepas leer un reloj ...)

Logan Serman
fuente
12

El realmente grande Lebowski

Paul Dixon
fuente
8

T R ou B L e.

Adam Rezich
fuente
8

¿Rotación en el tiempo, poco cojo?

Paul Dixon
fuente
6

¿Prueba las sobras de carne asada?

Paul Dixon
fuente
3

" T op, Derecha, Abajo, Izquierda"
R eally
B ad
L imerick

A pesar de
fuente
2

PROBLEMA es lo mejor para mí. Y si solo se muestran 3 valores, es Top, Sides, Bottom, que para los usuarios del Reino Unido significa TSB (el banco al que el gobierno tuvo que rescatar usando nuestro dinero), ¡así que TRouBLe y TSB están estrechamente vinculados!

Toby
fuente
2

PROBLEMA es siempre un recordatorio secundario para mí, ya que primero pienso en el sentido de las agujas del reloj, pero es posible que deba recordar por dónde empiezas; sin embargo, la abreviatura de 3 valores siempre me confundía hasta que me di cuenta de que el valor medio (o segundo) debe representar dos valores (los lados). Entonces, tres valores, el segundo siendo 2 valores, me ayudan a recordar eso.

Mitch Powell
fuente
2

El truco del reloj funciona para el atajo de 4 números, pero ¿hay alguna lógica para los atajos de 3 y 2 números? 1 número y se aplica a todo, y eso tiene sentido, pero

1 = (T/R/b/l) 
2 = (T=b) (R=l)   
3 = (T) (R=l) (b)  
4 = (T) (R) (b) (l)

Simplemente no parece lógico en absoluto. Pero ... El primer valor pertenece a la parte superior, el segundo pertenece a la derecha, el tercero es la parte inferior y el cuarto es la izquierda; No se especifica un número si es igual que su opuesto. Se DEBE declarar horizontal y vertical a menos que todos los valores sean idénticos.

En otras palabras, siempre especifica los valores Superior y Derecha, inferior e izquierda caen según sea necesario.

TRT
fuente
1

Piense que está leyendo Arabii o hebreo: lea desde la parte superior de la página, de derecha a izquierda hasta la parte inferior. ; P Lo bueno de esta "regla" es que también funciona para la versión de 3 valores: top right-and-left bottom

En realidad, también pensé que era difícil de recordar, pero tan pronto como descubrí que era la dirección del reloj, fue más fácil.

Stein G. Strindhaug
fuente
1

Está

top
right 
bottom 
left

no lo que tienes

T hink R vuelo B que ntes L eap

DD59
fuente
Hay un "tú" extra.
ziyuang
1

Siempre hay la ciudad de TRumBuLl Connecticut


fuente
1

* T * op * R * amen, * B * ottom, * L * unch

David Horne
fuente
1

Recuerde la lección de conducción:

Gire a la derecha antes que a la izquierda

invitado
fuente
0

Si tienes la edad suficiente para recordar la serie de televisión original de Star Trek (ya sabes, con el capitán Kirk), primero que nada, eres demasiado viejo. Pero está el episodio " The Trouble with Tribbles ". Ambos sustantivos en el título funcionan. Lo he usado en el pasado, pero también prefiero la analogía del reloj.

mikekehrli
fuente
0

Siempre que golpee con una situación dada, solo piense en una rotación en el sentido de las agujas del reloj, es decir, la forma en que el reloj gira de 0 a 60 en una rotación circular.

Lo del reloj es más fácil de recordar que la palabra PROBLEMA (como respuesta marcada) en mi opinión, ya que la palabra trouble pertenece al idioma inglés y todas esas mentes nativas del idioma inglés pueden encontrar más fácil recordar la palabra PROBLEMA en relación con la situación dada, pero no otros que solo usan el idioma inglés cuando realmente tienen que hacerlo.

No ocurre lo mismo con la rotación de un reloj en el sentido de las agujas del reloj, cuando se trata de recordar algo (como se hizo la pregunta), ya que la rotación en el sentido de las agujas del reloj es un fenómeno muy conocido en el mundo.

R K
fuente
0

Algunas abreviaturas (se puede considerar la que suena familiar):

  1. TR OU BL E ( TR OU BL ESHOOT , TR OU BL ESOME )
  2. T E R RI BL E
  3. TR IB BL E
  4. T que R oyal B ritish L egión
  5. T TABACO R oad B asketball L eague
  6. T provisoria R evenue B orrowing L IMIT
  7. T ransformational R ule- B asándose L ganancia
drac_o
fuente