Problems with the Navbar and port view

Tell us what’s happening:
Describe your issue in detail here.
i still getting this : Your #navbar should always be on the left edge of the window.

   **Your code so far**
/* file: index.html */
<!DOCTYPE html>
<html>
 <head>
 <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">    <title>documentation</title></head>
<body>
 <nav id="navbar">
   <header>
     <a class="nav-link" href="#Html">Html</a>
     <a class="nav-link" href="#Paragraph">Paragraph</a>
     <a class="nav-link" href="#Horizontal_line">Horizontal line</a>
     <a class="nav-link" href="#Comments">Comments</a>
     <br>
     <a class="nav-link" href="#Html_attributes">Html attributes</a>
   </header>
 </nav>
<link href="styles.css" href='styles.css' />
<main id="main-doc">
 <br><hr>
<section class="main-section" id="Html"><header>Html</header>
<p>Html stands for hyper text markup language.</p>
<p>everything in a html document is surrounded by the </p><code> < html> tag </code>tag.
<p>the head of an html document contains all of the non-visual elements that help make the page work</p>
<p>to add a line of text use</p>
<code>< br></code>
</section>

<section class="main-section" id="Paragraph"><header>Paragraph</header><p>to create a paragraph, simply type in the < p> element with its opening and closing tags</p>
<code>< p>< /p></code></section>
<section class="main-section" id="Horizontal_line"><header>Horizontal line</header><p>to create a horizontal line use</p><code>< hr/>tag</code></section>
<section class="main-section" id="Comments"><header>Comments</header><p> to create a comment</p><code>< !-- --></code></section>
<section class="main-section" id="Html_attributes"><header>Html attributes</header><p>provide additional information about an element or tag, while also modifying them.</p>
<p>attributes are always specified in the star tag.</p><p>some attributes:</p>
<ul>
<li>align</li>
<li>width</li>
<li>src</li>
<li>height</li>
<li>href</li>

</ul>

</section>
</main>
</body>
</html>
/* file: styles.css */
header{
 margin:0 0 0px 100px;
}
#navbar{
 vw:10vw;
 display: flex;
 flex-direction: row;
padding:0;
margin:0;  border-right:5px solid 
   blue;
 height:100%;
 opacity:1%;
// margin:0px 100%
//0 0;
 width:40%;
 z-index: 1;
 //top:0;
 left:0;
 position:fixed;
 background-color:white;
 //width:100vw;
 //display:flex;
 //justify-content:flex-start;
 
}


@media only screen and (max-width: 815px) {
}
.text,p,code,h3{
 font-style:italic;
 text-align:center;
margin: 0 0 0 45% ;
 
}
header{
 font-family:Comic Sans Ms;
}

li  {
list-style:none;
 font-size:50px;
 margin:0 80% 0 0;
 
}


.list1 li{
 
 margin:0 70% 0;
 list-style-type:lower-greek;
}
nav{
 position:fixed;
 //margin:0 auto auto 0;
}
   **Your browser information:**

User Agent is: Mozilla/5.0 (X11; CrOS x86_64 12239.92.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.136 Safari/537.36

Challenge: Build a Technical Documentation Page

Link to the challenge:

You’ve got some issues with your CSS. vw is not a valid property name (I think you might have meant width?). Comments in CSS use /* ... */ not //. Try fixing all of these issues first and then get back to us if you need more help.

Also, you definitely don’t want a closing curly here.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.