Css Div内无脚本标记显示不好

我想在用户禁用javascript时显示noscript警告，就像StackOverflow一样

我使用以下html：

<noscript>    
  <div id="noscript-warning">
    Este sitio funciona mejor con JavaScript habilitado. Descubrí
    <a href="">cómo habilitarlo.</a>
  </div>
</noscript>

其中#container是我的模板的主要内容元素

当noscript标记可见时，它会出现在某些内容的前面。我不想这样，内容应该显示在警告下方

---

我该怎么做？

问题在于您在警告上设置了

位置：已修复。你不能期望页面的内容在这一点上移动，因为你要把它固定在浏览器窗口的顶部。向下滚动时会发生什么？整个页面的内容重新排列，以绕过警告

您是否希望警告即使滚动也会卡在浏览器窗口的顶部？如果没有，则您不需要查找
position:fixed
。
如果您希望position:fixed的行为，并且需要从顶部向下推初始内容，则可以在noscript区域中包含第二个div。为该分区设置可见性：隐藏，高度等于该分区的高度，位置：固定。
+1：如果你想要一个固定的警告，警告下方的内容干净，这种方法是有效的。-1:AaronSieb的解决方案让你吃蛋糕，吃蛋糕。
#noscript-warning
{
    font-family: Arial,Helvetica,sans-serif;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 101;
    text-align: center;
    font-weight: bold;
    font-size: 12pt;
    color: white;
    background-color: #AE0000;
    padding: 10px 0;
    display: block;    
}

#noscript-warning a
{
    color: #FFFFC6;
}

#container
{
    width: 98%;
    margin: auto;
    padding: auto;
    background-color: #fff;
    color: black;
    border-style: solid;
    border-color: #3E4F4F;
    border-width: 1px 2px 2px 1px;
    line-height: 130%;
}