Stuck on: User Story #1: My tribute page should have an element with a corresponding id="main", which contains all other elements

HTML-CSS
#1

Tell us what’s happening:
I am stuck on User Story #1: My tribute page should have an element with a corresponding id="main" , which contains all other elements.
I have tried various suggestions from freecodecamp forum (and even one on github) but I don’t seem to be able to get it to pass the test.

Your code so far

#main  {......
}
<h1 id="main"> Title </h1>
and others

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.182 Safari/537.36.

Challenge: Build a Tribute Page

Link to the challenge:

#2

Hi @johnmander
Maybe if you post a link to your codepen for people to look at your code, you will get the help you need.

1 Like
#3

I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

Pre-formatted-text
Pre-formatted-text1356×380 401 KB

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (’).

#4

If you aren’t using codepen, if it’s online somewhere, provide a link. If you’re developing this locally, then put it in a repo and provide a link, please.

#5

https://codepen.io/johnmander/pen/xxRpOBP

#6

Thank you, I’m very new to this (I have completed the challenges).

1 Like
#7

The pen you supplied is empty.

#8

I’ve deleted pretty much everything as nothing I was trying seemed to be working.

#9

The only code I see in that pen is the script tag for the test suite. What are you asking us to check?

#10

I tried the options which you kindly put in the right format for me. They didn’t seem to work, I also tried these in both the CSS and HTML boxes.

#11

I am stuck on User Story #1: My tribute page should have an element with a corresponding id=“main”, which contains all other elements and would like to know what to do to get it right.

#12

OK, I don’t understand what you are trying to do here. I assumed that you had a finished app and you couldn’t understand why test 1 was failing. Now it sounds like you are just starting and trying to get test 1 to pass, I assume writing code to pass each test, working through them one by one.

Both are reasonable questions, we just need to know what you are asking.

#13

OK, so assuming it is the latter, and you are just trying to build to the first test, I can do that just in the html.

I see the user story is:

My tribute page should have an element with a corresponding id="main" , which contains all other elements.

So, we need a container with that id. Now, normally a container would not be an h1 - that is for text. If you want something to contain “all other elements”, then I would default to something like a div. So, create a div and give it the correct id. Then for some reason it doesn’t seem to pass unless there is something in it (must be how the test was written) so go ahead and add your h1 title inside it.

If I do that, the first test passes for me.