Block elements and inline elements
Before we finally get into a description of the most important CSS properties by category, we need to say a few words on two categories of elements: block elements and inline elements.
Think of block elements as rectangular areas of your screen or page. They can contain text, data, and other block elements, as well as inline elements. Typical block elements are the <div> and <p> tags. Before and after every block element, a new line of text is created.
Inline elements can only contain inline elements and not block elements. Also, they cannot be given a width. They inherit the width from the container that they are inside of. The most popular inline element is the <span> element, typically used to change the look of a chunk of text inside more text.
For starters this can be confusing, because block elements like <div> may be block elements, but when they have no content inside of them, they appear not to have any width or height. Moreover...
