With semantic HTML, do we no longer use the div element?

With semantic elements the div element is no longer used?

From the introduction to semantic HTML, the div element is a non-sematic element which means that the div element does not provide information about the content between the opening tags and closing tags.
We are advised to used semantic HTML element to enhance accessibility, Search Engine Optimization, and readability.


With advanced styling, you will notice that you need to enclose one block within another within another and so on, and in these settings using <div> with class and/or id is just practical. But whenever you build a main structure of your website, you should use semantic elements for all the reasons mentioned before.


I am new to HTML. Now that I know that using div element is non-semantic and we are advised to use semantic HTML elements, why we use div element at all? Does the div element still have purpose?

There is a limited number of semantic elements and you might decide that <div> with a class (like wrapper, container, jumbotron etc) may be more appropriate, particularly when you style your website. This is how I understand and use it. Whenever I can use a semantic element, I favour it, though.


Thanks so much! I appreciate your rapid reply.

is Section Tag considered a Block element

Yes. The <section> element is a block-level element



The way I understand it, you should really only use the < div > element to separate sections into “containers” for CSS purposes. For example: if you wanted to group multiple sections into one container to style it a certain way you could use < div id=“container-1” >; all sections within “container-1” would have a specific styling you would dictate in the CSS file. Other than this purpose, I see no reason to use a < div > element. If there is another purpose, I would love to hear it, lol.

Hope this explanation is clear!


This isn’t quite right. At the end, there isn’t a right and a wrong in HTML, but a ‘best practice’ and ‘convention’

<div> elements should only be used for styling purposes. If you want to group related content, you should use <section> elements or <article> element depending on whether the content is self-contained or not

However, if there’s any time you want to group content just to style it later on, it’s better if you use <div>s


So is it right to say that one benefit of div tags are that we can use them anywhere, even within semantic elements, and add style to them with CSS?

Very good question , from my sid ei would say use Semantic elements when ever you need to have a descriptive tag for the content inside it , however you should use Divs if you want to have different containers for example you can have a semantic element to describe this is the main ocntent of the page howver you should use divs forexample for an art gallery where every image with its content should be included into divs

this might sound silly, but since it’s been said that you would use

for styling purposes in css, wouldn’t that also be the case with using semantic elements also?