This is a paragraph. It has a span element, an inline element wide enough to fit this contents. It's styled with a background color of red and a BIG margin of 30px that only show at the left and right.This is an em element, another inline element with embedded italics. It was styled with a background color of gray. It has a small padding of 3px.

This is a div, a block element. It takes up all the available width. It was styled with a black background color and white font color.

By the way, never put a block element inside an inline element like this, ya dummy.

Do it like this instead, smartypants ;). Says who? The teacher Rich Armstrong whose Skillshare profile I've just linked with another inline element, the a element.

Heading 1

Look at this input element. It's inside a paragraph tag and looks like an inline element, but the margin, border, and padding apply vertically. Just look at how the input box push away the span and text on ALL sides, not just left and right. This block is now SO much bigger than the rest!