samedi 16 septembre 2017

Why there is a blank line at the top of the page?

I've just learning HTML/CSS for a few days and I'm having trouble with this: enter image description here Why there is a blank line at the top of the page? Can someone tell me what was wrong or missing from my code? How can I fix it?

Here's my code:

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    body {
      margin: 0;
      padding: 0;
    }
    
    header {
      text-align: center;
      background-color: lightgray;
    }
    
    header h1 {
      font-size: 70px;
    }
    
    ul {
      background-color: gray;
      padding: 10px;
    }
    
    li {
      display: inline;
      margin: 0 5px 0 5px;
    }
    
    a {
      color: white;
      text-decoration: none;
      text-transform: uppercase;
      font-size: 18px;
    }
  </style>
</head>

<body>
  <header>
    <h1>My Website</h1>
    <p>A sample website</p>
    <ul>
      <li><a href="#">HOMEPAGE</a></li>
      <li><a href="#">ABOUT ME</a></li>
      <li><a href="#">CONTACT</a></li>
    </ul>
  </header>
</body>

</html>

Thanks in advance!

à

Aucun commentaire:

Enregistrer un commentaire