Layout

box1

Inspect this box to see the HTML for it. It is made with a div tag.

In the inspector, look at the styles for this box. It has a width, height, and border. Those styles are needed to make a box.

This box also has padding and margin styles. In the inspector, uncheck those styles and observe what happens.

box2

In the inspector, look at the styles for this box. Both box1 and box2 have a display: inline-block style, which puts the boxes side by side. Uncheck that style and observe what happens.

Both box1 and box2 have a vertical-align: top style, which makes the top of the boxes line up with each other. Uncheck that style and observe what happens.