Why should <main> have an 'id'?

Hi there

I’m doing the Tributepage task and in the first user story i’m asked the following:
User Story #1: My tribute page should have an element with a corresponding id="main" , which contains all other elements.

I understand this would look like <main id="main"> </main>, however i’m confused as why you would give the section ‘main’ an ID that states the same thing: ‘main’… can someone enlighten me?

same would go for Userstory4, here I have to give an image the id of ‘image’ which would lead to: <img id="image"> but why?


Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/86.0.4240.198 Safari/537.36.

Challenge: Build a Tribute Page

Link to the challenge:

It’s so that it’s easy for the tests to locate it.

1 Like

Concerning the <main> tag, you have a point - as long as there’s only one main tag on a page (which should be the case), you wouldn’t really need an id to identify it.

But a webpage has often more than one image, and they probably won’t all be the same size or generally have the same styles, so you’re giving them an id (or class) to style them individually.

ok, and am i right to assume that if, for example, i use 3 images with layout A and 2 images with layout B, it would be better to group them both in to seperate ‘classes’, instead of using an ID?

Yes that’s exactly the idea.

1 Like