Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS How to Make a Website CSS: Cascading Style Sheets Take a Mobile-First Approach

Posted by john larson
john larson
16,594 Points

trying to understand "div"

Is this correct about "div" in the html file. The purpose of "div" is to identify a section that styling will apply to. And "wrapper" is the area around the body? please help me understand. Thank you. :D

Dylan Espey
Dylan Espey
10,578 Points
Dylan Espey
Dylan Espey
10,578 Points

You are, for most intents and purposes, correct! However, in the vein of understanding, there is a little more to it.

A "div" is more of a generic grouping of other elements. Let's say I wanted to make an image at the top of my page such as this one on [Firewatch.com](www.firewatchgame.com) that has text and a scrolling effect (known as "Parallax scrolling"), I would most likely put it in a div to separate it from the body copy because they are visually grouped together. HTML5, the version you will be working with, offers some more semantically appropriate variations on the div such as "article", "nav", and "aside" which do about the same thing but are more specific.

The "wrapper" in this case is an "id" added onto a div. This "id" allows us to target that specific div with visual styles that will not affect any of the other divs on the page without that particular id (and since an id should only be applied to one element on a page, it should be the only id). This allows us create, for example, a block of reusable styles that we can apply to an object on each page of our website.

Congratulations on getting started at Treehouse! Hope to see you around the forum.

1 Answer

ilithya
ilithya
19,818 Points
ilithya
ilithya
19,818 Points

Hi John,

I recommend you to go and take a look at this document, whenever you have doubts, about what an HTML element does: https://developer.mozilla.org/en/docs/Web/HTML/Element

Your "div" definition is partly accurate, because a "div" could define a section in an HTML document, but it also can group several elements for styling purposes. E.g.

<div>
</div>

or 

<div>
  <p></p>
  <ol></ol>
</div>

And "wrapper" is not an HTML element. I think you might have confused a class or id named "wrapper" inside a div or another HTML element. E.g. 

<div class="wrapper">
</div>