Lesson: HTML5 and CSS

Adjusting the Padding of an Element

Now let's put our Cat Photo App away for a little while and learn more about styling HTML.

You may have already noticed this, but all HTML elements are essentially little rectangles.

Three important properties control the space that surrounds each HTML element: padding, margin, and border.

An element's padding controls the amount of space between the element's content and its border.

Here, we can see that the green box and the red box are nested within the yellow box. Note that the red box has more padding than the green box.

When you increase the green box's padding, it will increase the distance between the text padding and the border around it.

Change the padding of your green box to match that of your red box.

---