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

Question

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

然后我使用了padding-top:40px，这对于textarea中的内容是可以的，但是你会看到滚动条有问题（它会在栏后面）。

只需看一下 jsFiddle

即可

Answer 1

将padding-bottom: 40px添加到导航栏，然后将其从文字区域中删除。

Answer 2

使用

postion:fixed;
and margin to push contents out

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

Answer 3

替代 @Andrw Ice 的回答

你必须给textarea s margin一些推动。

JSfiddle Demo

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

body {
    border:1px solid transparent;
}

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