Workshop Mission Services Portfolio Content Contact
  bookmark me  
Home > Content

(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

p {margin-left: 25px}

'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)

 

1.818.509.2649