Pls I need help with this particular task. I’ve done everything required but it keeps Saying “Your #navbar should have exactly one header element within it.”
Which it has.
Please post your code here.
1 Like
<!Doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width",initial-scale="1.0">
<title>Technical documentation</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<main id="main-doc">
<section class="main-section" id="Introduction_to_Html_and_Css">
<header>
<h1>Introduction to Html and Css</h1>
</header>
<p>Html is an acronym for Hypertext-markup language, while Css is an acronym for Cascading styles sheet.</p>
<p> They are both the basic structures for building web pages.</p>
<nav id="navbar">
<header id="header">Html is an acronym for Hypertext-markup language, while Css is an acronym for Cascading styles sheet. They are both the basic structures for building web pages.</header>
<a href="#Introduction_to_Html_and_Css" class="nav-link">Introduction to Html and Css</a>
</nav>
</section>
<section class="main-section" id="Is_Html_and_Css_a_programming_language?">
<header>
<h1>Is Html and Css a programming language?</h1>
</header>
<p>The answer is NO. Html and Css are not programming languages.</p>
<p>Html basically does the text aspect of your website and its a markup language while Css does the styling of the website.</p>
<nav id="navbar">
<header id="header">The answer is NO. Html and Css are not programming languages, Html basically does the text aspect of your website while Css does the styling of it.</header>
<a href="#Is_Html_and_Css_a_programming_language?" target="_self" class="nav-link">Is Html and Css a programming language?</a>
</nav>
</section>
<section class="main-section" id="Example_of_Html">
<header>
<h1>Example of Html</h1>
</header>
<p>There are various examples of Html, but we would talk about just four. Each of the element stated below has their functions and must be put in an opening and closing tag.</p>
<code> 1. h1 <br></br></code>
<code> 2. body <br></br></code>
<code>3. doctype declaration<br></br></code>
<code>4. a</code>
<nav id="navbar">
<header>There are various examples of Css, but we would talk about just four. Each of the element stated below has their functions and must be put in an opening and closing tag.</header>
<a href="#Example_of_Html" target="_self"class="nav-link">Example of Html</a>
</nav>
</section>
<section class="main-section" id="Example_of_Css">
<header>
<h1>
Example of Css
</h1>
</header>
<p>There are various examples of Css, but we would talk about just one which is the body element.</p>
<p> We would style the body element by giving it a background color of white and a margin of 0. make sure you take note of every signs.</p>
<code> body { <br></br>
background-color: white; <br></br>
margin: 0; <br></br>}
</code>
<nav id="navbar">
<header id="header">There are various examples of Css, but we would talk about just one.</header>
<a href="#Example_of_Css" target="_self" class="nav-link">Example of Css</a>
</nav>
</section>
<section class="main-section" id="Importance_of_learning_Html_and_Css_as_a_beginner_in_programming">
<header>
<h1>Importance of learning Html and Css as a beginner in programming</h1>
</header>
<p>As a beginner in programming, it is important that you know the concepts of Html and Css. <br></br> Some of the Importance of learning this includes;</p>
<li>It prepares you for a better understanding of other languages.</li>
<li>You can actually build simple web pages with your knowledge.</li>
<li>It is fun to learn, especially learning with freecodecamp!</li>
<li>It is easier to understand.</li>
<li>It gives you an edge to learning javascript.</li>
<nav id="navbar">
<header id="header">As a beginner in programming, it is important that you know the concepts of Html and Css</header>
<a href="#Importance_of_learning_Html_and_Css_as_a_beginner_in_programming" target="_self" class="nav-link">Importance of learning Html and Css as a beginner in programming</a>
</nav>
</section>
<section class="main-section" id="Where_can_i_learn_Html_and_Css_for_free?">
<header>
<h1>
Where can i learn Html and Css for free?
</h1>
</header>
<p>You can learn Html and Css on freecodecamp.org. Its very beginner friendly and offers all you need to get started.<br/></p> <p>The fun part is, its for free!</p>
<nav id="navbar">
<header id="header">You can learn Html and Css on freecodecamp.org. Its very beginner friendly and offers all you need to get started.<br/> The fun part is, its for free!
</header>
<a href="#Where_can_i_learn_Html_and_Css_for_free?" target="_self" class="nav-link">Where can i learn Html and Css for free?</a>
</nav>
</section>
<section class="main-section" id="Reference">
<header>
<h1>
Reference
</h1>
</header>
<nav id="navbar">
<header id="header">Nwaneri Georginia</header>
<a href="#Reference" class="nav-link"target="_self">Reference</a>
</nav>
</section>
</main>
</body>
</html>
body {
background-color: grey;
margin: 10px;
justify-content: in-line;
border: 100px;
}
p {
font-size: 18px;
font: sans-serif;
}
a {
position: left;
left: 20%;
visibility: visible;
margin: 5px;
}
header nav {
font-size: 12px;
color: brown;
margin: 0;
}
header {
font-size: 18px;
font: helvetica;
}
@media (max-width: 1199px) and(min-width: 768px) {
.nav-link {
position: left;
width: 60px;
}
#navbar {
width: 60px;
}
}
#navbar {
font: sans-serif;
color: black;
font-size: 18px;
}
section {
border-left: 10px;
border-bottom: 10px;
}
.main-section {
margin: 0;
border: none;
}
Technical documentation
It prepares you for a better understanding of other languages.
You can actually build simple web pages with your knowledge.
It is fun to learn, especially learning with freecodecamp!
It is easier to understand.
It gives you an edge to learning javascript.
As a beginner in programming, it is important that you know the concepts of Html and Css
Importance of learning Html and Css as a beginner in programming
The fun part is, its for free! Where can i learn Html and Css for free?
Introduction to Html and Css
Html is an acronym for Hypertext-markup language, while Css is an acronym for Cascading styles sheet.
They are both the basic structures for building web pages.
Html is an acronym for Hypertext-markup language, while Css is an acronym for Cascading styles sheet. They are both the basic structures for building web pages. Introduction to Html and CssIs Html and Css a programming language?
The answer is NO. Html and Css are not programming languages.
Html basically does the text aspect of your website and its a markup language while Css does the styling of the website.
The answer is NO. Html and Css are not programming languages, Html basically does the text aspect of your website while Css does the styling of it. Is Html and Css a programming language?Example of Html
There are various examples of Html, but we would talk about just four. Each of the element stated below has their functions and must be put in an opening and closing tag.
1. h1
2. body
3. doctype declaration
4. a
There are various examples of Css, but we would talk about just four. Each of the element stated below has their functions and must be put in an opening and closing tag.
Example of Html
Example of Css
There are various examples of Css, but we would talk about just one which is the body element.
We would style the body element by giving it a background color of white and a margin of 0. make sure you take note of every signs.
body {
background-color: white;
margin: 0;
}
There are various examples of Css, but we would talk about just one.
Example of Css
Importance of learning Html and Css as a beginner in programming
As a beginner in programming, it is important that you know the concepts of Html and Css.
Some of the Importance of learning this includes;
Where can i learn Html and Css for free?
You can learn Html and Css on freecodecamp.org. Its very beginner friendly and offers all you need to get started.
The fun part is, its for free!
You can learn Html and Css on freecodecamp.org. Its very beginner friendly and offers all you need to get started.The fun part is, its for free! Where can i learn Html and Css for free?
Reference
Nwaneri Georginia ReferenceI just pasted the link but its not showing as code but as text
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.
See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').
Your code should only have one nav element.
on each section element?
One nav element in the whole entire file
please help me out, i’ve put only one nav element which contains one header as
requested. now they are saying all the .nav-link should be in the navbar(nav element). pls how is that possible when each .nav-link must be in a section element which must contain a header. same header we are avoiding from being in the navbar. Im really confused and its giving me headache. i have been doing this since two days getting to 3 days.
type or paste code here
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width",initial-scale="1.0">
<title>Technical documentation</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<main id="main-doc">
<section class="main-section" id="HTML_AND_CSS">
<header>HTML AND CSS</header>
<nav id="navbar">
<header id="header">Html is an acronym for Hypertext-markup language, while Css is an acronym for Cascading styles sheet. They are both the basic structures for building web pages.</header>
<a href="#HTML_AND_CSS" class="nav-link">HTML AND CSS</a>
</section>
<section class="main-section" id="Introduction_to_Html_and_Css">
<header>
<h1>Introduction to Html and Css</h1>
</header>
<p>Html is an acronym for Hypertext-markup language, while Css is an acronym for Cascading styles sheet.</p>
<p> They are both the basic structures for building web pages.</p>
<a href="#Introduction_to_Html_and_Css" class="nav-link">Introduction to Html and Css</a>
</section>
<section class="main-section" id="Is_Html_and_Css_a_programming_language?">
<header>
<h1>Is Html and Css a programming language?</h1>
</header>
<p>The answer is NO. Html and Css are not programming languages.</p>
<p>Html basically does the text aspect of your website and its a markup language while Css does the styling of the website.</p>
<a href="#Is_Html_and_Css_a_programming_language?" target="_self" class="nav-link">Is Html and Css a programming language?</a>
</section>
<section class="main-section" id="Example_of_Html">
<header>
<h1>Example of Html</h1>
</header>
<p>There are various examples of Html, but we would talk about just four. Each of the element stated below has their functions and must be put in an opening and closing tag.</p>
<code> 1. h1 <br></br></code>
<code> 2. body <br></br></code>
<code>3. doctype declaration<br></br></code>
<code>4. a</code>
<a href="#Example_of_Html" target="_self"class="nav-link">Example of Html</a>
</section>
<section class="main-section" id="Example_of_Css">
<header>
<h1>
Example of Css
</h1>
</header>
<p>There are various examples of Css, but we would talk about just one which is the body element.</p>
<p> We would style the body element by giving it a background color of white and a margin of 0. make sure you take note of every signs.</p>
<code> body { <br></br>
background-color: white; <br></br>
margin: 0; <br></br>}
</code>
<a href="#Example_of_Css" target="_self" class="nav-link">Example of Css</a>
</section>
<section class="main-section" id="Importance_of_learning_Html_and_Css_as_a_beginner_in_programming">
<header>
<h1>Importance of learning Html and Css as a beginner in programming</h1>
</header>
<p>As a beginner in programming, it is important that you know the concepts of Html and Css. <br></br> Some of the Importance of learning this includes;</p>
<li>It prepares you for a better understanding of other languages.</li>
<li>You can actually build simple web pages with your knowledge.</li>
<li>It is fun to learn, especially learning with freecodecamp!</li>
<li>It is easier to understand.</li>
<li>It gives you an edge to learning javascript.</li>
<a href="#Importance_of_learning_Html_and_Css_as_a_beginner_in_programming" target="_self" class="nav-link">Importance of learning Html and Css as a beginner in programming</a>
</section>
<section class="main-section" id="Where_can_i_learn_Html_and_Css_for_free?">
<header>
<h1>
Where can i learn Html and Css for free?
</h1>
</header>
<p>You can learn Html and Css on freecodecamp.org. Its very beginner friendly and offers all you need to get started.<br/></p> <p>The fun part is, its for free!</p>
<a href="#Where_can_i_learn_Html_and_Css_for_free?" target="_self" class="nav-link">Where can i learn Html and Css for free?</a>
</section>
<section class="main-section" id="Reference">
<header>
<h1>
Reference
</h1>
</header>
<a href="#Reference" class="nav-link"target="_self">Reference</a>
</nav>
</section>
</main>
</body>
</html>
type or paste code here
1 Like
they keep asking this " All of your .nav-link elements should be in the #navbar"
1 Like
when we code, we code for a reason.
Placing this block (the nav block) where you have it now doesn’t really make sense for a nav-bar. A nav-bar is a tool for navigation. It helps you navigate the page and should be located at the top of the page.
So move the code so it is the first element in the body and add a closing </nav> tag to it.
After that make the header of the nav-bar something meaningful.
Something that describes what this whole page is about in a short and concise way.
Then make your nav-bar contain the requested links to each section of your page.
If you do this correctly, your nav-bar will look like a series of links that work to take you down into the page to the appropriate section.
read the user-stories slowly and one-by-one.
Complete one at a time.
And ask if you need help understanding a specific user story.
thank you so much! Finally got it.
1 Like
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.