About Section element in HTML

Hello guys,
I am new to programming, Can someone explain me where “main” and “section” elements are used and what is difference between them.

I don’t think all the words came through in your question. Which elements do you want explained. I’m assuming one is the section element, but I don’t know the other.

sorry, typo mistake . I have updated question, kindly look into it

The main element is used to denote the main, or primary content on the page. There should always and only be one main element on a page. The primary benefit of using the main element is to help people who use screen readers understand your page better. The main element is considered to be a “landmark” element and screen reader users can navigate the page by landmarks. Usually the main element wraps all of the content on the page except for the header and footer content, and possibly some aside content.

The section element is primarily used to help web authors organize their content logically. As far as accessibility is concerned, it really is no different than a div with one exception. If you give it a programmatically accessible name (with either aria-label or aria-labelledby) then it automatically takes on the role of region which turns it into a “landmark” element.

Bottom line, always have one and only one main element which wraps all of the main content on your page. Use section elements to break up your HTML into logical sections so that it is easier to read but don’t worry too much about their proper usage because they are really just divs except for that one special situation.

Thanks for explaining in detail.

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