CSS box model tutorial
CSS box model is a way of displaying elements by browsers that process all tags as small rectangular blocks. For browsers, any tag is a container with content: text, images, other tags, etc.
- Margin (outer indent) is an empty space (field) that separates one element from the other or from the edge of the browser window's viewing area. The simplest example of an outer indent is the space between paragraphs that follow each other.
The area of the outer indent is transparent and can not have its own color and other appearance effects.
- Border (element frame) is a border on either side of the element. The frame can be set on all sides of the element and on one side.
Using the border, you can simply beautifully decorate an element or visually separate the contents of the current element from other elements of the page.
- Padding (inner indent) is the empty space between the contents of an element and its border.
The inner indentation area is transparent and can not have its own color or other appearance effects.
- Most elements have a content area that contains the entire content of the element (text, inserted images, or nested (child) elements).
With this theme look: