CSS tutorial margins and padding properties Free Web Design Tutorials
Home   HTML CSS JavaScript PHP MySQL Usability Glossary
CSSBasicsImplementing CSSCSS SyntaxPseudo Classes/ElementsCSS ClassesCSS PropertiesFontColor and BackgroundTextBorderCSS margins and padding propertiesMargins and PaddingSize and Position

Home > CSS > Margins and Padding Propertiesprinter version

Margins and Padding Properties

CSS margins are the amount of space between an element and the elements that surround it. Padding is the amount of space between the content and the border of an element.

Units of Measurement

Units of measurement, when applied to margins and padding, may either be relative or absolute. Absolute units have no real meaning on a computer screen so are not covered here. Relative units include ...

Example of Setting the Margins and Padding Properties of a Class
.element_class_name {
margin: 8px;
padding: 4px;
}


PropertyDescriptionValues
marginSets the size of all margins around the element.
If length is used it must be set to units of measurement.
auto
length
percentage
margin−topSets the size of the top margin of the element.
If length is used it must be set to units of measurement.
auto
length
percentage
margin−rightSets the size of the right margin of the element.
If length is used it must be set to units of measurement.
auto
length
percentage
margin−bottomSets the size of the bottom margin of the element.
If length is used it must be set to units of measurement.
auto
length
percentage
margin−leftSets the size of the left margin of the element.
If length is used it must be set to units of measurement.
auto
length
percentage
paddingSets the size of all padding within the element.
If length is used it must be set to units of measurement.
auto
length
percentage
padding−topSets the size of the top padding within the element.
If length is used it must be set to units of measurement.
auto
length
percentage
padding−rightSets the size of the right padding within the element.
If length is used it must be set to units of measurement.
auto
length
percentage
padding−bottomSets the size of the bottom padding within the element.
If length is used it must be set to units of measurement.
auto
length
percentage
padding−leftSets the size of the left padding within the element.
If length is used it must be set to units of measurement.
auto
length
percentage


Previous - Border Properties Previous - Border Properties     Next - Size and Position Next - CSS Size and Position Properties


Privacy | Terms | Contact | Links | Sitemap | RSS Feeds RSS and JavaScript Feeds
©2009 www.webdesignworkmate.co.uk all rights reserved 
Design and Production by smallbizonline website design © 2000-2009
Valid HTML 4.01! Level Double-A conformance icon, W3C-WAI Web Content Accessibility Guidelines 1.0Valid CSS!
Tips and TricksMenu ButtonsSpecial Effects
Recommended Reading
CSS - the missing manual

The CSS anthology

Beginning CSS web development