Div's & section's

HTML & CSS
1

Hello I was looking into the difference between the <div> and <section> tags
and the proper way to use them is like this?:

<section>
      <div>
     </div>
</section>

what is the purpose of the <section> tag? I know it is knew in HTML5
but it was meant to replace the need for divs correct?

2

No, it does not replace div, div is still the generic “meaningless” block container, section has a meaning and proper usage.

The section element is not a generic container element. When an element is needed only for styling purposes or as a convenience for
scripting, authors are encouraged to use the div element instead. A general rule is
that the section element is appropriate only if the element’s contents would be
listed explicitly in the document’s outline.

http://www.w3.org/TR/html5/sections.html#the-section-element

2 Likes
3

So we should never use a “class” or “id” in the section tags? ony on divs?

4

when they are needed for CSS or JavaScript or linking to that spot in the page you would use them.

you just don’t need them to identify that it is a section

5

There is no reason not to use id or class on a section. I often use id on sections of an article for anchors in the page index to target:-

<li><a href="#chapter5" title="Jump to Chapter 5">Chapter Five</a></li>

Etc… Etc…

<section id="chapter5">

And as felgall says, you may need it for applying css or simialr.
Although I do see people putting class and id to html5 tags unnecessarily, for example:-
<header id="header"> or <footer class="footer">
but there are cases when this is needed, like if there are a number of headers on the page, and this is the main page header.

6

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.