如何使导航栏真正全宽和静态答案

【问题标题】：How to make navigation bar really full width and static如何使导航栏真正全宽和静态
【发布时间】：2013-11-18 20:48:40
【问题描述】：

我完全没有编程、html、css 或任何东西的经验。尽管如此，我还是想制作某种网站，但一开始我就在努力解决几个问题。对于初学者，我的 wordpress 主题让我无需接触任何代码即可拥有全宽导航栏。好的，但我想在导航栏下有一个全宽的阴影效果。这不会发生，无论我在哪里尝试挖掘问题，我都做不到。 the link to my website.

如您所见，投影不会全宽。我见过使用这种效果的网站，所以它应该是可能的。是不是我的主题有问题，我应该忘记它吗？（是的，这个网站真的很丑，但我打算有空的时候更新一下）

【问题讨论】：

标签： wordpress navigation css

【解决方案1】：

在您的 CSS 中，您需要从 div id="navigation" 中删除 boxshadow 并将其添加到 div id="nav-container"

类似这样的：

#nav-container {
-webkit-box-shadow: 0 5px 14px rgba(0, 0, 0, 0.7);
box-shadow: 0 5px 14px rgba(0, 0, 0, 0.7);
}

【讨论】：

我认为这行不通。填充应用于此 div，防止在填充区域显示阴影效果。
我首先尝试了这个，虽然它在编辑代码时似乎可以在浏览器中工作，但在应用于自定义样式时却不起作用。我只是试图把它放在任何其他自定义 css 之前，突然它开始工作了.. 去看看。这个我以前试过，呵呵。谢谢。

【解决方案2】：

用另一个 div 包裹你的 nav-container div 并对其应用投影效果。应用更改后的代码如下所示

<div class="shadow">
    <div id="nav-container">
          .....
    </div>
</div>

那么css中的shadow类应该是这样的

.shadow{
    box-shadow: 0 5px 14px rgba(0, 0, 0, 0.7);
}

【讨论】：