2013-02-09 112 views
1

所以基本上我無法刪除頁面的頂部。這只是空白,不管我改變我的CSS多少,我似乎都無法改變任何事情。我想讓我的導航欄位於頁面頂部,沒有填充或邊框或任何東西。這是我的代碼,我知道這可能是最簡單的事情,只是我現在找不到它。刪除頁面頂部的邊框

HTML

<!DOCTYPE html> 

<html> 

<head> 
    <meta name="Description" content="This is a test website!"/> 
    <meta name="author" content="Me!"/> 
    <title>test | Home</title> 
    <link type="text/css" rel="stylesheet" href="css/style.css"/> 
</head> 

<body> 

    <div id="wrapper"> 
     <nav id="navmenu"> 
      <ul> 
       <li>Home</a> 
       <li>About</li> 
       <li>Tutorials</li> 
       <li>Services</li> 
       <li>Contact Us</li> 
      </ul> 

     <aside id="sidenews"> 

     </aside> 

     <div id="center"> 

      <section id="mainsection"> 
       <article> 
        <header> 
         <hgroup> 
          <h1>This is a test</h1> 
          <h2>I like tests!</h2> 
         </hgroup> 
        </header> 
        <section> 
         <p>This is the main section of my section (sectception)</p> 
        </section> 
        <footer> 
         <p>Time and date</p> 
        </footer> 
       </article> 
      </section> 

     </div> 

     <footer id="cright"> 
      <p>This is the copyright section. All rights reserved.</p> 
     </footer> 
</body> 

</html> 

CSS

*{ 
margin: 0; 
padding: 0; 
} 

header, section, footer, aside, nav, article, hgroup{ 
    display: block; 
} 

a{ 
    text-decoration: none; 
    color: #FFF; 
} 

a:hover{ 
    color: #333399; 
} 


#wrapper{ 
    width: 1000px; 
    margin: 20px auto; 
    text-align: left; 
    background-color: #FFF; 
} 

#navmenu{ 
    background: #3366CC; 
    color: #eee; 
    text-align: center; 
    height: 100px; 
    padding: 0; 
    margin:0; 
    float: top; 
    width: 100%; 
} 

#navmenu li{ 
    display: inline-block; 
    list-style: none; 
    padding: 20px; 

} 

#navmenu li:hover{ 
    color: #FFF; 
    background: #3399FF; 
    border-radius: 15px; 
    -moz-border-radius: 5px; 
} 




#mainsection{ 
    float:left; 
    width: 630px; 
    margin:30px; 
    margin-top: 2 
    background-color:#FFF; 
    color: #222; 
    text-align: left; 

} 

#cright{ 
    text-align: center; 
    background-color: #AAA; 

    clear: both; 
} 

#center{ 
    width: 1000px; 
    height: 1000px; 
    background-color:#FFF; 
} 

#sidenews{ 
    float:right; 
    width: 250px; 
    height: 940px; 
    margin: 0px 0px; 
    padding: 30px; 
    background-color:#FFF; 
} 

回答

9

更改包裝爲0的保證金?

#wrapper{ 
    margin: 0 auto; 
} 
1

您的#wrapper元素的頂邊距爲20px - 是嗎?

#wrapper{ 
    width: 1000px; 
    margin: 0 auto; 
    text-align: left; 
    background-color: #FFF; 
} 
1

設置保證金爲0的包裝

#wrapper { 
    background-color: #FFFFFF; 
    margin: auto; 
    text-align: left; 
    width: 1000px; 
}