Why should we use divs if they don't change things visually?

Thank you! I wasn’t understanding why they would be added, but now I think I get it. Not visually, but to add organization or dividers / breaks in the code.

1 Like

thank you guys for help it was wonderful

1 Like

This really helps clear up my confusion. Thanks a bunch!

Thank you for this clear explanation.

A good question, and I think a problem with the structure of the course prompts it. At this point, DIV is useless. I would have introduced them later. In the section on attributes I would have asked the question “Doesn’t it suck that we have to repeat attributes in multiple elements? There is a solution to that. That is, we can apply, for example, a font style to multiple elements – and then revert back to the original!”

Then you have a powerful, and the original, motivation for DIV.

2 Likes

Here, divs are for organizing content. They do not serve a visual purpose (until we get into css), and you don’t need to add them at all, but they are really useful for keeping your content logically organized. We add div tags to place blocks of related elements into a container. Here a div is placed above About Brown Bears and below the Features because that is a logical block - it is the section that contains info about brown bears.

Think of it as a literal container, like drawers in a dresser. You have socks in one drawer, shirts in another drawer. Here we have Media in one drawer, habitat in another, species and features in yet another.

You can have containers within containers, divs within divs, like items placed in boxes and boxes placed on shelves in a warehouse.

When you get into CSS you’ll discover the utility of this. Instead of applying the same style to every element within a container, you apply it to the container and the contents inherit that style.

9 Likes

**

Jedi Master Yoda

**! @mtf you sir are a legend amongst us! :100: :fist:

1 Like

I just learned here on codecademy that ‘comments’ do not render any line break spaces between the text lines/paragraphs.
I understand that the purpose of both <div>s and <!--..comments...--> is different.

Just think of it in terms of organization and categorization. The more you categorize, the more you will be able to play with individual sections.

very uesful, understand more schemetic.

Style without using div:
image

Div without using Style:
image

Using both Div and Style:
image

I was a little lost too. Hope this helps! sorry for the three replies but I could only add one image per reply

1 Like

I think it wants us to know how to section or group elements. But I think we have to use semantically containers these days.

Yes, div and section do the same thing and the difference is in semantics, to help better categorize the data or the page, and it’s useful for SEO.

So is

just a useful tool for developers on the coding side of things, so they can remember what sections are supposed to be separate from other sections? Would the text appear the same way on the front end with or without
's? This only improves readability for the coders working on the actual code if I’m understanding correctly.

With just plain HTML divs are just for readability and so you know what each part is. But with CSS you use divs for styling.

1 Like

When you start to style your page with CSS DIV’s allow you to target different sections with a styling of their own. One DIV may be a different color than another DIV or have a different border or be positioned in a certain place. So sectioning your HTML with DIVs allows much easier targeting for your styling on particular elements.

I still don’t understand why its needed when you can just use the spacebar,?

Nice!!
Explanations are really good.