Formatting/Class problems

1

Im having problems with classes/id’s in CSS and I think it may be because I’m struggling understanding the concept of format, but I’m not sure. Maybe I have my elements in the wrong place.

This is my code for a top navbar. I understand there is a better element for navbar but my question lies within the ID

<!doctype html>
<html>
<head>
  <link href="https://fonts.googleapis.com/css?family=Nunito|Quicksand" rel="stylesheet">
<div class="container-fluid">
<title>Navigation Bar</title>
  </head>
  <body>
    <div id="navbar">
    <div class="container-fluid">
  <ul class="container">
    <li><a href="#">Home</a></li>
    <li><a href="#">About</a></li>
    <li><a href="#">Contact</a></li>
    <li><a href="#">Projects</a></li>
    <li><a href="#">Testimonials</a></li>
    </div>
  </ul>
</div>

I used “navbar” as an ID for the div to change the font. In my CSS I used this:

#navbar {
  display: block;
  float: left;
  margin: 5px;
  color: black;
  text-align: left;
  text-decoration: none;
  padding: 14px 16px;
  }

There is no change in font. What am I doing wrong?

2

Do you have this online somewhere to be able to look at it?

You have your <div> tags out of place which can mess with formatting.

Look closely at your <ul> tags… you have a closing div before your closing ul, when it should come after it. Cleaning up HTML can in itself of times fix issues…

1 Like
3

Thanks much! I feel like I’ve been struggling conceptually, but I’m slowly starting to pick it up.

4

Oh yeah for sure the more you do the more you’ll get it… everything looks really good though, only the one closing tag out of order…you’re doing great :smiley: