I was working on my project and left it for a few days, when I went back to the page and removed the instruction panel, my project was replaced with a blank sheet. Also, when I decided to look at my project in a separate window by clicking on the button to the right of “preview”, there was an empty white screen, I reloaded the page several times, nothing helped, as if I hadn’t code.
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="styles.css">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Documentation Page</title>
</head>
<body>
<main id="main-doc">
<section class="main-section">
<header>
<nav id="navbar">
<div class="nav">
<h1 class="Documentation"> HTML Documentation</h1>
<a class="nav-link" href="#Introduction" id="Introduction"> Introduction</a>
<a class="nav-link" href="General view" id="general view"> General view</a>
<a class="nav-link" href="Browsers" id="Browsers"> Browsers</a>
<a class="nav-link" href="HTML document structure" id="document structure">HTML document structure </a>
<a class="nav-link" href="The browser wars" id="wars">The browser wars </a>
</div>
</nav>
</header>
</section>
<section class="main-section">
<div class="main-doc">
<h1 class="Introduction" id="Introduction">Introduction</h1>
<p>HTML is a standardized hypertext markup language for viewing web pages in a browser. Web browsers receive an HTML document from a server via HTTP/HTTPS protocols or open it from a local disk, then interpret the code into an interface that will be displayed on the monitor screen.</p>
<p>HTML elements are the building blocks of HTML pages. HTML provides the means to create headings, paragraphs, lists, links, quotes, and other elements. HTML elements are distinguished by tags written using angle brackets. There are different types of tags:</p>
<ul>
<li>Tags such as < img/> and < input /> directly introduce content into the page. </li>
<li>Other tags, such as < p>, surround and style text within themselves, and may include other tags as subelements.</li>
</ul> <p>Browsers do not render HTML tags, but use them to interpret page content.</p>
</div>
</section>
<section class="main-section">
<h1>General view</h1>
<p>The HTML hypertext markup language was developed by British scientist Tim Berners-Lee around 1986-1991 at CERN in Geneva, Switzerland. </p>
<p>HTML was created as a language for the exchange of scientific and technical documentation, suitable for use by people who are not specialists in the field of layout.</p>
<p>The first public description of HTML was the "HTML Tags" document, first mentioned on the Internet by Tim Berners-Lee in late 1991.</p>
</section>
<section class="main-section">
<h1>Browsers</h1>
<p>Text documents are processed by special applications that display the document in its formatted form.</p>
<p>These applications, called "browsers" or "web browsers", typically provide a user-friendly interface for requesting, viewing, and displaying web pages on other external devices.</p>
<p></p>
<p></p>
</section>
</main>
</body>
</html>
/* file: styles.css */
body{
font-family:Helvetica;
margin:0;
}
.nav{
border-right:3px solid black;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
float:left;
height:100%;
background-color:#d3d3d3;
}
a:hover{
background-color:#DAA520;
}
.nav-link{
padding:10 63 25 63;
text-decoration: none;
font-size:17px;
color:#800000;
}
.main-doc{
padding-left:21rem;
}
.Documentation{
font-size:25px;
}
p{
color:#666;
font-size:15px;
padding:10px 20px 10 58px;
}
.Introduction{
padding:25 30 10 40;
}
ul{
padding:10px 20px 10 98px;
}
li{
color:#666;
padding:8px
}
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/110.0.0.0 YaBrowser/23.3.0.2246 Yowser/2.5 Safari/537.36
Challenge: Technical Documentation Page - Build a Technical Documentation Page
Link to the challenge:
