The CSS Box model is really quite simple. Every element in a document is considered to be a rectangular box which has a content area surrounded by padding, a border and margins. If you know the Art of the Table, you should be able to figure out how each plays out quite simply.
Here's a nice little ascii art about it.
------------------------------------
(1) | |
| (3) This is the Content. |
(2) Fear it not. |
| |
------------------------------------
1. Margin, 2. Border, 3. Padding
There are two kinds of boxes, inline and block. Think of block boxes as page formatting tags, such as <p>, <div>, and <ul>. Think of inline boxes as text formatting tags, such as <b>, <i>, and <a>, and the content itself.