CSS Basic Box Model is a module of CSS that defines the rectangular boxes—including their padding and margin—that are generated for elements and laid out according to the visual formatting model.

Reference

Properties

Properties controlling the flow of content in a box

Properties controlling the size of a box

Properties controlling the margins of a box

Properties controlling the paddings of a box

Other properties

Guides

Introduction to the CSS box model
Explains one of the fundamental concept of CSS: the box model. This model defines how CSS lays out elements, including their content, padding, border, and margin areas.
Mastering margin collapsing
Sometimes, two adjacent margins are collapsed into one. This article describes the rules that govern when and why this happens, and how to control it.
Visual formatting model
Explains the visual formatting model.

Specifications

Specification Status Comment
CSS Basic Box Model Working Draft  
CSS Level 2 (Revision 1) Recommendation  
CSS Level 1 Recommendation Initial definition

Browser compatibility

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 1.0 1.0 (1.7 or earlier) 3.0 3.5 1.0 (85)
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 1.0 1.0 (1) 6.0 6.0 1.0

Document Tags and Contributors

 Contributors to this page: mfluehr, Sebastianz, teoli
 Last updated by: mfluehr,