I’ve edited your code 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.
this code still looks broken?
(has many issues to fix still)
Please use the link I gave you before and paste your code in the validator to see all the errors that need fixing.
i fixed as many eroors as i could but one of them was i had a closing header tag but no opener but if i move the header tag it fails one of the test i also had the same issue for the nav element errors what do i do
maybe your fixes are not quite correct.
Can you give me an example of an error and what you thought was the correct fix?
(so show me the error message by copying it and pasting it here and then explain what change you did to fix it and how you believe that causes a problem for the test).
You may want to just fix everything first and get a clean html before even attempting the fCC test too.
Error: End tag header seen, but there were open elements.From line 19, column 1; to line 19, column 9li>↩</ul>↩</header>↩</nav
i tried to fix this by moving the header endtag ext to the open tag but when i did that the test said that the nav tag had to be decendent of the header
the second error was 1. Error: Unclosed element nav.From line 10, column 2; to line 10, column 18cat"> ↩ ↩ <nav id =nav-bar>↩ <ul>i dont understand this because the next error is 1. Error: Stray end tag nav.From line 20, column 1; to line 20, column 6</header>↩</nav> ↩<if so i put the closing tags for the nav element closer together and it still didnt work
here is the code i tried to do the little back tick thing but all that happens is a blue highlight bounces around the window
we can see that the first error is the </header> which doesn’t close anything.
So for now, we can remove that closing tag. (even if fCC wants a header, we can come back and add one later after the html is fixed).
So I removed that </header> and the other header tag
This got rid of all the errors.
Now we can go back and look at what fCC wants and work with a clean html.
Give that a try (remove those 2 things and check).
Also don’t forget to add the closing tag for the html element in the last line of your index.html.
ps. you are also missing the closing tag of your head element. So please add that after your last link element and before the ‘body’ of your code begins.
You really should also define the body element too.
ok html code is clean the fcc wants
3. Your #header-img should be a descendant of the #header .
7. Your #nav-bar should be a descendant of the #header .
9. Each .nav-link element should have an href attribute.
10. Each .nav-link element should link to a corresponding element on the landing page (has an href with a value of another element’s id. e.g. #footer ).
so you’ll need a body element.
Put all the code that is not in the head element inside the body element.
Then you’ll need to work on each of the requests one by one.
Do you know what the header is supposed to be for? (and where it should go?)
ive done everything i can think of but i cant get the fcc to pass 9. Each .nav-link element should have an href attribute. and
Failed:10. Each .nav-link element should link to a corresponding element on the landing page (has an href with a value of another element’s id. e.g. #footer).
<!DOCTYPE html>
<html lang="en">
<head>
<meta name= "viewport" content="width=device-width,intial-scale=1.0">
<meta charset="utf-8">
<title> creating a landing page</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<header id=header>
<img id="header-img" src="https://www.pexels.com/photo/selective-focus-photography-of-orange-tabby-cat-1170986/" alt="orange cat">
<nav id =nav-bar>
<ul>
<li class="nav-link"> <a href="bad">bad </a>
</li>
<li class="nav-link"> <a href= "home">home</a></li>
<li class="nav-link" ><a href="suck" >suck</a>
</li>
</ul>
</nav>
<iframe id="video" src= "https://www.youtube.com/watch?v=myiwU0PbXX0&pp=ygUTaG9vZiB0cmltaW5nIGtuaWZlcw%3D%3D" title= "how to trim a hoof"> </iframe>
<form id="form" action="https://www.freecodecamp.com/email-submit">
<input id=email type=email name=email placeholder=email>
<input id="submit" type="submit"></form>
<div class="flex-container">
<img
src="https://cdn.freecodecamp.org/curriculum/css-photo-gallery/1.jpg" alt="slepping cat" >
<img src="https://cdn.freecodecamp.org/curriculum/css-photo-gallery/2.jpg" alt="playing cat">
<section id="bad">
<h2> bad</h2>
<p> the name of my cat is bad girl</p>
</section>
<section id="home">
<h3> home</h3>
<p> my second cats name is home girl.</p>
</section>
<section id="suck">
<h4>suck</h4>
<p> my oldest cats name is sucks her name was supoosed to be socks but all i could say when i got her is sucks.</p>
</section>
</div>
</header>
</body>
</html>
so i tried running that and i got the same test that failed can you see anything
<html lang="en">
<head>
<meta name= "viewport" content="width=device-width,intial-scale=1.0">
<meta charset="utf-8">
<title> creating a landing page</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<header id=header>
<img id="header-img" src="https://www.pexels.com/photo/selective-focus-photography-of-orange-tabby-cat-1170986/" alt="orange cat">
<nav id =nav-bar>
<ul>
<li class="nav-link"><a href="#bad">bad</a>
</li>
<li class="nav-link"><a href="#home">home</a></li>
<li class="nav-link"><a href="#suck">suck</a>
</li>
</ul>
</nav>
<iframe id="video" src= "https://www.youtube.com/watch?v=myiwU0PbXX0&pp=ygUTaG9vZiB0cmltaW5nIGtuaWZlcw%3D%3D" title= "how to trim a hoof"> </iframe>
<form id="form" action="https://www.freecodecamp.com/email-submit">
<input id=email type=email name=email placeholder=email>
<input id="submit" type="submit"></form>
<div class="flex-container">
<img
src="https://cdn.freecodecamp.org/curriculum/css-photo-gallery/1.jpg" alt="slepping cat" >
<img src="https://cdn.freecodecamp.org/curriculum/css-photo-gallery/2.jpg" alt="playing cat">
<section id="bad">
<h2> bad</h2>
<p> the name of my cat is bad girl</p>
</section>
<section id="home">
<h3> home</h3>
<p> my second cats name is home girl.</p>
</section>
<section id="suck">
<h4>suck</h4>
<p> my oldest cats name is sucks her name was supoosed to be socks but all i could say when i got her is sucks.</p>
</section>
</div>
</header>
</body>
</html>
