Nesting HTML5 section tags

Question

Is this a correct way to use the

tag?

Answer 1

Note:

My answer is severely out-of-date, and no longer contains sound advice given the changes to HTML that have happened in the last decade. I will be leaving this answer as-is for historical context, but please be aware that the structure suggested is not best practice—particularly around the use of the obsolete document outline.

Short answer: The code as you've provided is not semantically valid.

Long answer:

section elements are meant to mark up sections of content. Each section of content (i.e. Introduction, Abstract, content, conclusion) could have subsections.

If you're using those elements for structural purpose, you should be using div elements instead. They are semantically meaningless.

This would be more semantic:

  

    

      Some content
    
  

This would be a semantic way of marking up nested sections:

  
Fizz Buzz
  

    
Foo bar baz
    ...
  
  

    
Lorem ipsum dolor
    ...
  
  ....