我有一大块白色空间，我似乎无法从我正在处理的网站上移除它并让我疯狂。它位于页面顶部。
body {
margin: 0;
padding: 0;
}
#container {
width: 100%;
background-color: #c3c3c3;
}
#main-header {
position: fixed;
width: 100%;
background-color: black;
color: white;
margin: 0;
}
h1 {
float: left;
margin: 0.5% 0.5% 0.5% 4%;
}
#main-header nav {} nav ul li {
display: inline;
}<body>
<div id="container">
<header id="main-header">
<h1>DEdesigns</h1>
<nav>
<ul>
<li><a href="#">Home</a>
</li>
<li><a href="#">About</a>
</li>
<li><a href="#">Services</a>
</li>
<li><a href="#">Contact</a>
</li>
</ul>
</nav>
</header>
<!-- end header -->
<article id="about-me">
<header>
<h2>About Me</h2>
</header>
<section>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged</p>
</section>
<aside>
<figure>
<img src="#" alt="#" width="#" height="#">
</figure>
</aside>
</article>
<!-- end #about-me -->
<div id="gallery">
<header>
<h2>My Work</h2>
</header>
<div id="gallery-conatiner">
<figure>
<img src="#" alt="#" width="#" height="#">
</figure>
<section>
<aside>
<p>rem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500</p>
</aside>
</section>
<!-- ends first row -->
<section>
<aside>
<p>rem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500</p>
</aside>
</section>
<figure>
<img src="#" alt="#" width="#" height="#">
</figure>
<!-- ends second row -->
<figure>
<img src="#" alt="#" width="#" height="#">
</figure>
<aside>
<p>rem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500</p>
</aside>
</section>
<!-- ends third row -->
</div>
</div>
<!-- end #gallery -->
<article id="services">
<header>
<h2>Services</h2>
</header>
<section>
<ol>
<li>one</li>
<li>two</li>
<li>three</li>
</ol>
</section>
</article>
<!-- end #services -->
<article id="contact-me">
<header>
<h2>Contact Me</h2>
</header>
<p>some contact me stuff goes here</p>
</article>
<!-- end #contact-me -->
<footer>
<p>This is my fotter</p>
</footer>
</div>
<!-- end #container -->
</body>
提前致谢
答案 0 :(得分：2)
将top: 0添加到#main-header。
body {
margin: 0;
padding: 0;
}
#container {
width: 100%;
background-color: #c3c3c3;
}
#main-header {
position: fixed;
top: 0;
width: 100%;
background-color: black;
color: white;
margin: 0;
}
h1 {
float: left;
margin: 0.5% 0.5% 0.5% 4%;
}
#main-header nav {} nav ul li {
display: inline;
}
#about-me {
position: relative;
margin-top: 39px;
padding-top: 5px;
}<body>
<div id="container">
<header id="main-header">
<h1>DEdesigns</h1>
<nav>
<ul>
<li><a href="#">Home</a>
</li>
<li><a href="#">About</a>
</li>
<li><a href="#">Services</a>
</li>
<li><a href="#">Contact</a>
</li>
</ul>
</nav>
</header>
<!-- end header -->
<article id="about-me">
<header>
<h2>About Me</h2>
</header>
<section>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged</p>
</section>
<aside>
<figure>
<img src="#" alt="#" width="#" height="#">
</figure>
</aside>
</article>
<!-- end #about-me -->
<div id="gallery">
<header>
<h2>My Work</h2>
</header>
<div id="gallery-conatiner">
<figure>
<img src="#" alt="#" width="#" height="#">
</figure>
<section>
<aside>
<p>rem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500</p>
</aside>
</section>
<!-- ends first row -->
<section>
<aside>
<p>rem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500</p>
</aside>
</section>
<figure>
<img src="#" alt="#" width="#" height="#">
</figure>
<!-- ends second row -->
<figure>
<img src="#" alt="#" width="#" height="#">
</figure>
<aside>
<p>rem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500</p>
</aside>
</section>
<!-- ends third row -->
</div>
</div>
<!-- end #gallery -->
<article id="services">
<header>
<h2>Services</h2>
</header>
<section>
<ol>
<li>one</li>
<li>two</li>
<li>three</li>
</ol>
</section>
</article>
<!-- end #services -->
<article id="contact-me">
<header>
<h2>Contact Me</h2>
</header>
<p>some contact me stuff goes here</p>
</article>
<!-- end #contact-me -->
<footer>
<p>This is my fotter</p>
</footer>
</div>
<!-- end #container -->
</body>