Hi guys, I’m brand new to html-css however I’ve been following a code-along to learn and my navbar wont seem to appear the same as the person doing the code-along.
HTML
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="css/style.css" />
<link
rel="stylesheet"
href="link"
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"
integrity="sha512-iBBXm8fW90+nuLcSKlbmrPcLa0OT92xO1BIsZ+ywDWZCvqsWgccV3gFoRBv0z+8dLJgyAHIhR35VZc2oM/gI1w=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
<title>Loruki | Cloud Hosting for Everyone</title>
<!--Navigation bar-->
<div class="navabr">
<div class="container">
<h1 class="logo">Loruki</h1>
<nav>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="features.html">features</a></li>
<li><a href="docs.html">docs</a></li>
</ul>
</nav>
</div>
</div>
CSS
@import url(“https://fonts.googleapis.com/css2?family=Lato:wght@300&display=swap”);
-
{
box-sizing: border-box;
padding: 0;
margin: 0%;
}
body {
font-family: “Lato”, sans-serif;
color: #333;
line-height: 1.6;
}
ul {
list-style-type: none;
}
a {
text-decoration: none;
color: #333;
}
h1,
h2 {
font-weight: 300;
line-height: 1.2;
margin: 10px 0;
}
p {
margin: 10px 0;
}
img {
width: 100%;
}
.navbar {
background-color: blue !important;
color: #fff;
height: 70px;
}
.container {
max-width: 1100px;
margin: 0 auto;
}