在顶部添加边距而不影响容器的高度

Question

由于我的导航栏，我必须添加高度与导航栏高度相同的边距。但是，当我添加边距时，我得到一个滚动条，因为body，html和container的高度设置为100％。如何为导航栏添加边距，而不是获得不必要的滚动条？为什么margin-bottom: -42px;不起作用？

body, html {
    height: 100%;
}

.navbar {
    z-index: 10;
}

.container-fluid {
    height: 100%;
    margin-top: 42px;
    // add margin from the nav bar
}

Answer 1

试试这个.container-fluid { height: 100%; position:absolute; top:42px; } 绝对元素从dom中删除并准确放置在您指定的位置

Answer 2

.container-fluid { overflow: hidden; }

这应隐藏滚动条