防止内容隐藏在固定位置的导航栏后面

Question

我有一个高度为40px的导航栏，我无法将其他内容（仅文本区域）放在该栏的下方。 我试图设置margin-top:40px; 到textarea，但是它不起作用。

然后，我使用padding-top:40px可以处理文padding-top:40px的内容，但是您会看到滚动条有问题（滚动条后面有问题）。

看看这个jsFiddle

Answer 1

向导航padding-bottom: 40px添加padding-bottom: 40px ，并将其从文本区域中删除。

Answer 2

采用

postion:fixed;
and margin to push contents out

http://jsfiddle.net/4Y63u/3/

Answer 3

作为@Andrw Ice的答案的替代方法

您只需要给textarea的空白添加一些内容即可。

JSfiddle演示

这很常见，因为优点是如果导航栏被隐藏，它不会导致任何元素移动。

body {
    border:1px solid transparent;
}

nav + textarea{
    margin-top: 40px;
}