In building a technical document, one of the Users Stories parameters states:
Each .main-section should have an id that matches the text of its first child, having any spaces in the child’s text replaced with underscores (_) for the id’s.
I am having trouble understanding exactly what I am being asked . I thought I understood, however my code is not passing…here is my code;
That is always possible… I will paste all html, because I am stumped and it is the final instruction to pass…
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Technical Documentation Page</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<main id="main-doc">
<h1>Indemand certifactions for today's inspired web developers</h1>
<p>Here is a suggestive career plan to put you on the right path to success in Software Development</p>
<nav id="navbar">
<header id="navbar">Page Navigation</header>
<link id="navbar"><a class="nav-link" href="#web_fundamentals">Web Fundamentals</a></link>
<link id="navbar"><a class="nav-link" href="#html_5">HTML 5</a></link>
<link id="navbar"><a class="nav-link" href="#css_3">CSS 3</a></link>
<link id="navbar"><a class="nav-link" href="#java_script">JavaScript</a></link>
<link id="navbar"><a class="nav-link" href="#bootstrap_5">BootStrap 5</a></link>
</nav>
<hr />
<section class="main-section" id="web_fundamentals">
<header class="web_fundamentals">
<h3>Web Fundamentals</h3></header>
<p>First step towards learning then earning in the catagory of software Development. Here are a few suggestions:</P>
<ul>
<li>Introduction of the World Wide Web</li>
<li>Web Fundamentals 101</li>
</ul>
</section>
<hr />
<section class="main-section" id="html_5">
<header class="html_5">
<h3>HTML 5</h3></header>
<p>HTML 5 Stands for Hypertext Markup Language. The number 5 meaning the 5th generation or version.</p>
<p>Here are a few examples of html looks like.</p>
<p>In the industry referred to as tags</p>
<ul>
<li><code>html, head, body, h1 - h6, p</code></li>
<li>These tags have a opening closing tags looks like this<code> < > </code></li>
</ul>
</section>
<hr />
<section class="main-section" id="css_3">
<header class="css_3">
<h3>CSS 3</h3>
</header>
<p>CSS stands for Casade Styling Sheets</p>
<p>The 3 is for the thrid generation</p>
<p>In other words, CSS is the color, font, and font weight.</P>
<p>I like to refer to Css as the pretty-ness of the webpage/website</p>
<p>There are selctors that pin point to a specific html element or tags.</p>
Here are the way that some of them look.
<ul>
<li><code>h1 {}</code></li>
<li><code>.input {}</code></li>
<li><code>#options {}</code></li>
</ul>
<p>The 'rule' of the selector is always between the curly brackets {}.</p>
</section>
<hr />
<section class="main-section" id="java_script">
<header class="java_script">
<h3>javaScript</h3>
</header>
<p>JavaScript is the functionality or behavior of the website.</p>
<p>JavaSript is conditional loops. Simply put, you create and assign varibles with statements: 'let' & 'const'</p>
<h6>Take a look at the example below</h6>
<ul>
<li>let example = "first";</li>
<li>Followed by sending the declared variable to the console</li>
<li>In order to accomplish this, a command is used which looks like "console.log(example)"</li>
</ul>
</section>
<hr />
<section class="main-section" id="bootstrap_5">
<header class="bootstrap_5">
<h3>BOOTSTRAP 5</h3>
</header>
<p></p>
<ul>
<li></li>
<li></li>
</ul>
</section>
</main>
</body>
</html>
The user story asks that " Each section element with the class of main-section should also have an id that corresponds with the text of each header contained within it."
The text within your header is ‘HTML 5’, not html 5, so it doesn’t correspond. Try that.
<section class="main-section" id="Introduction" >
<header>Introduction</header>
<p>Python is a popular, versatile, and easy-to-learn programming
language. Known for its clear syntax and readability, Python is used in
various domains, from web development and data analysis to artificial
intelligence and scientific computing.</p>
</section>
The id needs to match the text inside the element. the id should not match the class.
That’s not what I meant. The text inside h3 is javaScript, so the text for the id should be javascript. java_script is the class name of the header. In fact, you don’t actually need the h3 tags at all. Just the header tag. Look at my code:
<section class="main-section" id="Introduction" >
<header>Introduction</header>
<p>Python is a popular, versatile, and easy-to-learn programming
language. Known for its clear syntax and readability, Python is used in
various domains, from web development and data analysis to artificial
intelligence and scientific computing.</p>
</section>
I used the header tags instead of the h3, so it passed.