Question

我搜索过，似乎无法找到我要找的答案。

我想知道如何将我的div移到我的固定标题下面。

@import url(http://fonts.googleapis.com/css?family=Oswald);
body {
    width: 100%;
    margin: auto;
}

.container {
    width: 75%;
    margin: 0 auto;
}

.header {
    background: #6396bc;
    width: 100%;
    top: 0;
    position: fixed;
}

.logo {
    float: left;
    font-family: "Oswald", sans-serif;
    font-size: 15px;
    margin-left: 15%
}

a {
    text-decoration: none;
    color: white;
}

li {
    list-style: none;
    float: left;
    margin-left: 15px;
    padding-top: 15px;
    font-family: "Oswald", sans-serif
}

.nav {
    float: right;
    margin-right: 15%
}

<!DOCTYPE html>
<html>
    <head>
        <title>team Zeus | Home</title>
        <link rel="stylesheet" href="../stylesheets/styles.css">
    </head>
    
    <body>
        <div class="header">
            <div class="container">
                <div class="logo">
                    <h1><a href="#">team Zeus</a></h1>
                </div>
                
            <div class="nav">
                <ul>
                    <li><a href="#">Home</a></li>
                    <li><a href="#">Page</a></li>
                    <li><a href="#">Another page</a></li>
                    <li><a href="#">1 other page</a></li>
                </ul>
            </div>
            </div>
        </div>
        
        <div class="container">
        
        <div class="content">
            <p>I copied and pasted some article from Wikipedia in here, you could do that too (to test out the header at the top)</p>
        </div>
    </body>
</html>

我认为它与容器有关，因为当我尝试用宽度调整它们时，它只会混淆整页。我无法弄清楚

由于

Answer 1

你的意思是将内容移到标题下方？如果这就是你想要的，只需将内容div定位如下：

.div {
      position:relative;
      top: 100px;
}

Answer 2

我认为这肯定会有所帮助

enter image description here

将div降低到固定标题

2 个答案: