Question

我不知道为什么Contact和它下面的数据之间存在这个空白区域。我到处尝试了0px的边距，但是空白区仍然存在。知道如何解决？

由于

a screenshot of the part I am reffering to

    <header>
        <section id="logo">
            <img src="logo2.png" id="logoimg" alt="logo">
        </section>
        <nav>
            <ul>
                <a href="#top"><li>Home</li></a>
                <a href="#Agenda"><li>About Me</li></a>
                <a href="#HetTheater"><li>Projects</li></a>
                <a href="#edge2"><li>Contact</li></a>
            </ul>
        </nav>
        <footer>
        <p id="contactgegevens">
           xxxxxx xxxxxxx 
           xxxxxxxxx@hotmail.com
           tel: xx xxxxxxxx
         </p>
        </footer>

    </header>

Answer 1

您正在为height定义60vh（nav）并导致此问题。

删除它，导致高度自动，并且空白区域消失

nav{
    margin:0px;
    width:230px;
    min-width:150px;
}

这是Codepen。

定义的height也导致了一些响应问题。

Answer 2

因为标题上有固定高度，标题有边框。

header{
  height: auto;
    width:230px;
    border-right:1px solid black;
    position:fixed;
    text-align:center;
    font-family: 'Roboto', sans-serif;
}

DEMO：https://jsfiddle.net/znr1n39s/

白色空间问题

2 个答案: