HTML elements are either block level or inline and are accordingly rendered by the browser as block boxes or inline boxes.
Block boxes
- Stretch across the full width of the containing element / page
- Extend vertically down the page (as content is put in)
- Can contain any other boxes
- Often have margins, borders, and padding set
- e.g.: <body>, <h1>, <p>, <ul>, <div>
Inline boxes
- Contained inline within the parent block box element
- Only big enough to fit their content
- Can contain other inline elements, but not block boxes
- Rarely have margins, borders or padding set
- e.g.: <span>, <a>, <strong>, <em>, <code>