Shorthand Box Properties Test

The styles applied here are:

.inner	{background-color: #f99; color: black; }
.outer	{background-color: #9f9; color: black;
	border-style: solid; border-width: medium;
	margin-top: 5px; margin-bottom: 5px;}

.mone	{ margin: 10px; }
.mtwo	{ margin: 10px 5%; }
.mthree	{ margin: 10px 5% 3em; }
.mfour	{ margin: 10px 5% 3em 50pt; }

.pone	{ padding: 10px; }
.ptwo	{ padding: 10px 5%; }
.pthree	{ padding: 10px 5% 3em; }
.pfour	{ padding: 10px 5% 3em 50pt; }

.bone	{ border-width: 10px; }
.btwo	{ border-width: 10px 5em; }
.bthree	{ border-width: 10px 5em 3em; }
.bfour	{ border-width: 10px 5em 3em 50pt; }
The inner DIV should have a 10px margin.
The inner DIV should have a 10px margin on the top and bottom and a 5% margin on the right and left.
The inner DIV should have a 10px margin on the top, a 5% margin on the right and left, and a 3em margin on the bottom.
The inner DIV should have a 10px margin on the top, a 5% margin on the right, a 3em margin on the bottom, and a 50pt margin on the left.
The outer DIV should have 10px of padding.
The outer DIV should have 10px of padding on the top and bottom and 5% of padding on the right and left.
The outer DIV should have 10px of padding on the top, 5% of padding on the right and left, and 3em of padding on the bottom.
The outer DIV should have 10px of padding on the top, 5% of padding on the right, 3em of padding on the bottom, and 50pt of padding on the left.
The outer DIV should have a 10px border.
The outer DIV should have a 10px border on the top and bottom and a 5em border on the right and left.
The outer DIV should have a 10px border on the top, a 5em border on the right and left, and a 3em border on the bottom.
The outer DIV should have a 10px border on the top, a 5em border on the right, a 3em border on the bottom, and a 50pt border on the left.

Valid HTML 4.0!

(Back to CSS Testing Information, David Baron)

LDB, dbaron@dbaron.org