This site runs best with JavaScript enabled.

Remember TRBL

Remember TRBL Remember TRBL

This post (like many I write) is mainly for myself.

When using CSS padding or margin, I generally will write margin-top, margin-bottom, margin-left, etc. I know there is easier syntax where I can specify all for with one line such as

margin: 0 10px 88px 10px;

The problem is, I can never remember which one is where. Know I'm not going to forget. It's simply top, right, bottom, left... TRBL, TRouBLe, trouble. Who can forget trouble?

Sometime I want the top and bottom the same and the left and right the same. It is also a one-liner:

margin: 10px 20px; /_ top-bottom, right-left _/

No, I'm not going to remember TBRL, that would be stupid. I'll just remember to start at Top. See, no TRouBLe at all!

Share article
Dustin Davis

Dustin Davis is a software engineer, people manager, hacker, and entreprenuer. He loves to develop systems and automation. He lives with his wife and five kids in Utah.