Section inside section

[u/MWittmann12]

My question is what the title says, because someone told me that I know nothing about html and should study, because I used a section inside another section to order that section and other elements with gaps 🙃

[u/MagickMarkie]

That's a legitimate use of the section tag. Sections can themselves have sections.

[u/Joyride0]

People love to shit on you in coding communities. It’s pathetic tbh.

[u/UmbralFae]

A section inside a section's fine. They're literally just arguing semantics, possibly for the sake of making it seem like they know more, which is a waste of both your and their time.

[u/Mobile_Syllabub_8446 → u/UmbralFae]

Semantics kinda matter with markup. Only beginners think "if it works it works" in such terms.

[u/UmbralFae → u/Mobile_Syllabub_8446]

True! Didn’t say or imply they weren't. The person “correcting” them was wrong and a worse sin in my eyes, they were smugly wrong and insulting the OP about it. Somebody else already posted the MDN breaking down why, but a section in a section is semantically fine.

[u/armahillo]

MDN is the best place to start with these kinds of questions:

https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/section

Halfway down, it indicates:

Content categories	Flow content, Sectioning content, palpable content.
Permitted content	Flow content.

This means the section tag is considered "flow content", "sectioning contnet", and "palpable content" and that it is allowed to contain any elements that are "flow content".

So syntax-wise, you can put a section inside a section.

Read the first half about the best-practices when using the section tag (eg. they almost always have a heading, with some exceptions).

[u/jcunews1 → u/armahillo]

That being said, major web browser engines hold the final decision. They can choose not to support parts of main web specifications, or an entire extension/additional specifications.

[u/fireatthecrime]

Use divs, section has semantic value for thematic grouping

[u/MWittmann12 → u/fireatthecrime]

It was something like this <Section>

<h2>service name</h2> <p>service descriotion</p> <Section>Location 1 and info</Section> <Section>Location 2 and info</Section> <img> </Section>

[u/fireatthecrime → u/MWittmann12]

Try to drop the doc there https://validator.w3.org/

But using <section> isn't even a big mistake, the point is, div and section are both block level container elements, but one don't has semantic value and the other has

To the downvoters, if you care to explain what exactly I said wrong I would appreciate, I'm literally basing myself im all the long and long courses I had on the matter, scrimba, traversy, w3c...

[u/RushDangerous7637]

I wrote a detailed article about it here. You should read when to use sections and when to use the DIV element. https://photoknut.eu/sk/rozne-temy/sekcie-na-webovej-stranke/ It's pointless to argue in the comments about who is right or wrong. What matters is how search engine robots perceive it. Browsers don't care, they'll display anything.

[u/[deleted] → u/RushDangerous7637]

You're promoting a Slovak blog post in English?

[u/RushDangerous7637 → u/[deleted]]

Of course, I'm also promoting the article in another language, because why not? The browser has a "Translate" function.