显示块的定位问题

奥利弗·粉笔(Oliver Chalk)

我将导航设置为display: block;,将段落设置为,display: block;但是我的段落部分位于涵盖导航的页面顶部。我有用于导航的CSS,我会认为它应该将其他对象推开?

nav {
display: block;
}


 nav ul {
    display: block;
    position: fixed;
    -webkit-box-sizing: border-box; width: 100%;
    -moz-box-sizing: border-box; width: 100%;
    box-sizing: border-box; width: 100%;
    text-align: center;
    list-style-type: none;
    text-decoration: none;
    background: rgba(255,255,255,0.2);
    }

    nav li {
        display: inline-block;
        margin-left: 5px;
        margin-right: 5px;
        padding-top: 10px;
        padding-bot: 10px;
        font-family: "Changa One",Cursive;
        font-size: 1.225em;
        border-bottom: 2px solid transparent;
        transition: border-color 300ms;
        -webkit-transition: border-color 300ms;
        -moz-transition: border-color 300ms;
    }

这是我的段落代码:

p {
background-color: #fff;
display: block;
color: orangered;
}

如果我添加边距或填充,它仍会停留在页面顶部,只是将文本内部进一步往下推。使元素更大,但不能更远。任何答案都非常感谢:)

Luongatoolz
    position: fixed;

固定元素将忽略导航,使导航高度自动为0。您需要将导航高度设置为nav或更改导航ul的位置

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章