Editing Positioning Elements (section)

==== Border Property Shorthand ====

p105

CSS supports shorthand for borders.

Declaration order is always top, right, bottom, left. You can remember this as TRouBLe (Top, Right, Bottom, & Left). If you leave out a side CSS interprets the last side equal to the opposite side.

Example syntax without shorthand for borders:
<pre>{margin-top:3px; margin-right:3px; margin-bottom:3px; margin-left:3px;}</pre>

Example syntax with four sides:
<pre>{margin: npx npx npx npx} where n = number</pre>

Example syntax with three sides:
<pre>{margin: npx Npx npx} means top, right, bottom and make left equal to right (N)</pre>

Example syntax with two sides:
<pre>{margin: npx Npx} means top, right and make bottom equal to top (n)and left equal to right (N)</pre>

Example syntax with one side:
<pre>{margin: npx} means make all four sides equal to n.</pre>

If you want a side to be zero you can write it without using px. Example:
<pre>{border: 1px 0 2px 0}</pre>