|
(1) (2) (3) (4) (5) (6) (7) (8) (9) (10)
CSS List
Here is a list of CSS1 properties as they pertain to margins, border, positioning
elements, and lists. They will be broken down into various categories with
examples.
Margins, Borders and Padding Property
Every element is enveloped in a box that can be given margins, borders, padding
and lists. Below is information regarding all CSS1 margin properties.
'margin-top, margin-right,
margin-bottom, margin-left'
This defines the margin of a designated side of an element. Your choices are:
Any valid length expressed in px, em, ex and .in
A percentage of the window
inherit
'margin'
This defines the margin for all sides of an element. A single value defines
all margins to that element. Two values sets the top/bottom to the first
value and left/right to the second value. Three values sets the top margin
to the first value; left and right margins to the second value; and bottom
margin to the third value. Your choices are:
Any valid length expressed in px, em, ex and In
A percentage of the window
inherit
|
margin
- 1 value
|
|
body {margin: 25px}
|
|
Creates 25 pixel margins to all 4 sides of an element
|
|
margin
- 2 values
|
|
body {margin: 25px 150px}
|
|
Creates 25 pixel margins to the top and bottom; and a 150px
margins for the left and right
|
|
margin
- 3 values
|
|
body {margin: 25px 150px 100px}
|
|
Creates 25 pixel margin to the top; 150px margins for the
left and right sides and a 100 pixel margin for the bottom
|
'padding-top, padding-right,
padding-bottom, padding-left,'
This defines the padding width of a designated side of an element. Your choices
are:
Any valid length px, em, ex and In
A percentage of the window
inherit
|
body {padding-left: 25px}
|
'padding'
This defines the padding width for all sides of an element. A single value
defines all padding widths to that element. Two values sets the top/bottom
padding to the first value and left/right padding to the second value. Three
values sets the top padding to the first value; left and right padding to
the second value; and bottom padding to the third value. Your choices are:
Any valid length px, em, ex and In
A percentage of the window
inherit
|
padding
- 1 value
|
|
body {padding: 25px}
|
|
Creates 25 pixel padding to all 4 sides of an element
|
|
padding
- 2 values
|
|
body {padding: 25px 150px}
|
|
Creates 25 pixel padding to the top and bottom; and a 150px
padding for the left and right
|
|
padding
- 3 values
|
|
body {padding: 25px 150px 100px}
|
|
Creates 25 pixel padding to the top; 150px padding for the
left and right sides and a 100 pixel padding for the bottom
|
(1) (2) (3) (4) (5) (6) (7) (8) (9) (10) |