What is the point of nesting the <p> element in a <div> element?


#1

Question

In steps 1 and 2 of this exercise, both <p> elements display in the same exact way. As it doesn’t seem like anything special happened here, what is the point of nesting the <p> element in a <div> element?

Answer

In this case, this is done purely for demonstrative purpose. In the future you will find that <div> elements are often used to group related content. This can serve to give a page some added structure and to allow for more modular styling.


FAQ: Learn HTML Elements - Intro to HTML - HTML Structure
#2

It is primarily for the content creator and used to distinguish between paragraphs and sets of content.


#3

Can we use the div element in the following way?

<div>
<body>
</body>
</div>

If we cannot use it then please explain why


#4

no, as we can see in the documentation:

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/body
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/html

body must a child of html, the documentation shows the Permitted content and Permitted parents.


#5

I’m just setting out on learning this myself, but if I’m right, I’d say this is done because a body can have multiple divisions, but divisions cannot have multiple bodies and therefore the multiple divisions must be contained within the body.


#6

everything in the body is whats being shown on the screen on the webpage so having divisions in the inside would make sense right ?


#7

There is a hierarchy of tags in html. The html tag itself is the overall ‘parent’ tag. Followed by:
head which is the header section of the page and then the body that includes everything else. Divs are inside the body tags.


#10

When treated as having meaning, writing a number of paragraphs in a division is a way of telling the source reader that they are all grouped together. We don’t send a baker’s dozen out in the customer’s hands, we place them in a box, with wax paper between the layers so the frosting doesn’t stick to the paper.

Think back to what we learned about writing and outlining of essays going back to grade 8, and how that same process applied all the way through secondary and even tertiary education. HTML is a document just like that essay and the better we outline it, the easier it will be to interpret the source, and eventually present (which is a totally separate concern) the content. We give meaning to the content by how we structure it.