You can use a shorthand notation for setting certain CSS properties, for example:
div.example {
margin-top: 10px;
margin-right: 20px;
margin-bottom: 30px;
margin-left: 40px;
}
Is the same as:
div.example {
margin: 10px 20px 30px 40px;
}
Nothing revolutionary there.
However, I always have trouble remembering the order, so I came up with my own Gen-Y acronym (mnemonic) - trbl for trouble remembering. Get it?
That is, top right bottom left. Might be helpful next time you are writing some CSS and can’t remember the order…
Update: as a number of people have correctly pointed out, a better, more traditional way of remembering this would be to think of a clock – going clockwise from 12 (top) -> 3 (right) -> 6 (bottom) -> 9 (left).
I think of it as being like a clock. You start at 12 which is at the top, then move to 3 which is at the right… etc.
Comment by Lindsey — May 4, 2010 #
Hey that’s clever too! But I have trouble with clocks, I like mine digital
Comment by praj — May 4, 2010 #
I’m like Linds. I just remember where the first one is and then go clockwise. Easier than remembering the whole clock;)
Comment by Ben — May 4, 2010 #
Ok right that’s probably how you are supposed to think about it. I guess I just think about things in an odd way, but hey I kinda figured that anyway.
Comment by praj — May 4, 2010 #
You are funny, Praj. Maybe that’s why you referred to it as a Gen-Y acronym? Ben and I are Gen-Xers who learnt to tell the time back in the analog days, before digital clocks.
Comment by Lindsey — May 12, 2010 #