Margin Shorthand
Margin properties have a shorthand counterpart using the margin property. You'll have noticed that CSS shorthand properties tend to have quirks of their own, such as the order of values. Margins are no exception to this.
Using the margin property, you set up the values for your margins in this exact order: top, right, bottom, left. The popular mnemonic for this in the industry is “TRouBLe.” In Example 11-3, I'd set all the longhand properties for the body:
body {margin-top: 30px; margin-right: 30px; margin-bottom: 30px; margin-left: 130px;}
Although longhand doesn't require the specified margin order, I thought it would be helpful for you to see how this translates to shorthand:
body {margin: 30px 30px 30px 130px;}
You'll ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access