Question

I’ve heard that the HTML5 section element should not be used for styling purposes as its a semantic element. So <section class='wrapper'> as a replacement for a div would be wrong, using <div class='wrapper'> would be better.
But what when it makes sense to use the section element AND there is need for wrapper? Is it alright to do <section class='wrapper'> in that cases? Or do I have to to

<section>
  <div class='wrapper'>
    ..
  </div>
</section>

which seems a bit bloated to me?

Answer 1

I’ve heard that the HTML5 section element should not be used for styling purposes

Not sure what your source is, but they’re wrong. Style away!

That being said, <section> elements should be used when they’re semantically appropriate, as per the HTML5 spec:

The section element represents a generic section of a document or application. A section, in this context, is a thematic grouping of content, typically with a heading.