Click here to navigate the course.

Drag the edges to resize the window.

In Projects, you can keep track of your progress as you go throught the tasks. Check each item as you complete it!

Web Browser

Code Editor
Site Structure

Add a Div

Now that we know about HTML element nesting and parent/child relationships, let's see another way these concepts are applied on a real-life webpage.

Div elements divide your page by enclosing other elements. These enclosed groups of elements can then be organized, moved and styled independently from one another.

Div elements are often used with the class attribute. Here's an example:

<div class="main"> ... </div>

Note: The ... indicates where other HTML elements would normally be enclosed by the div.

Below, we will use divs to divide our page into three separate parts.

Report a Bug
If you see a bug or any other issue with this page, please report it here.