Code Editor
Web Browser

Classes and IDs are useful for labeling elements, but a disorganized, overuse of classes and IDs can result in an HTML file that is difficult to read. We need a way of organizing the contents of the HTML file. This will help:

  1. Keep HTML code easy to read.
  2. Group elements that belong together.

HTML offers an element that is the backbone of code organization: the div, represented by <div> in HTML.

You can think of the div as a box, or container, that groups elements that belong together.

For example, a <div> can be used to group together all of the elements that make up the navigation for a web page, or any other section of a page.

<div> <h1>Alice In Wonderland</h1> <p> ... </p> </div>

In the example above, a heading for "Alice In Wonderland" and a brief paragraph description of the book are contained within a single <div>. If more books were to appear on the page, additional divs could be used to organize them. This would keep the code easier to read, maintain, and style.

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