CODEWITHSUNDEEP
htmlcss
user3335812
user3335812

Reputation:

Where is single pixel space coming from?

In my HTML document, above the navigation, there is a mysterious single-pixel space that has appeared out of nowhere. Can anyone tell me where this might be coming from?

The HTML:

<body>
  <header>
    <ul id="navbar">
      <li><a href="/home.html">Home</a></li>
      <li><a href="/tv.html">TV & Video</a></li>
      <li><a href="/sports.html">Sports</a></li>
    </ul>
  </header>
</body>
</html>

& the CSS:

@charset "utf-8";
/* CSS Document */

html, body {
    margin: 0;
}


header {
    background-color: #CA0002;
    height: 120px;
    margin: 0;
    padding: 0;
}
    #navbar {
        list-style-type: none;
        margin: 0 auto;
        max-width: 1200px;  
    }

        #navbar li a {  
            background-image: url(../images/bg-nav.c.gif);
            background-size: cover; 
            background-position: left 80%;      
            color: white;
            float: left;    
            font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
            font-size: 80%;
            height: 25px;   
            text-align: center;
            text-decoration: none;
            width: 75px;
        }

Upvotes: 0

Views: 51

Answers (1)

Jay
Jay

Reputation: 792

you also need to select 0 padding on body like so;

body {
padding: 0;
margin: 0;
}

Upvotes: 1

Related Questions