我创建了可折叠链接来导航我的页面。我的导航栏中的所有菜单项（垂直，nav div 左浮动）也是它们自己的 div（折叠所必需的）。每个 div 都被设置为带有文本的按钮。
我为 :hover 伪元素使用了具有相对较大模糊半径的浅色 box_shadow。现在，当我将鼠标悬停在每个按钮/div 上时，看起来按钮/div 被点亮（很好），并且光线溢出它上面的按钮/div（也很好）。不幸的是，我悬停在下方的按钮/div 似乎漂浮在照明区域上方（不太好）。
有没有办法让 box_shadow 样式与光标悬停的 div 上方和下方的 div 重叠？我网站中的其他链接不会受到影响，因为样式仅适用于 div 而不适用于链接。
我已经完成了完美 (IMO) 设计的 99%，但是在我通常用作参考的教程中的任何地方，或者与此相关的任何其他地方，这个小问题似乎都没有答案。
小提琴：http: //jsfiddle.net/nrkYr/5/embedded/result/
图片： http ://desolosubhumus.webs.com/div%20overlap.jpg
分区 CSS：
.mH { cursor: pointer; width: 110px; background-color: #A0522D; color: #000000; font-family: "DreamerOne","sans-serif"; text-shadow: -1px -1px 1px #fc9c47, 1px 1px 1px #fc9c47, 1px 1px 2px #300b00; border: 0 solid #210a02; border-radius: 1em; font-size: 0.9em; font-weight: bold; text-align: center; margin: 1px; box-shadow: inset 0 0 4px 4px #210a02; }
.mH:hover { cursor: pointer; width: 110px; background-color: #F5A77F; font-family: "DreamerOne","sans-serif"; color: #c96914; text-shadow: -1px -1px 1px #210a02, 1px 1px 1px #210a02, 1px 1px 2px #000000; border: 0 solid #876e68; border-radius: 1em; font-size: 0.9em; font-weight: bold; text-align: center; margin: 1px; box-shadow: inset 0 0 4px 4px #432c24, 1px 1px 35px 1px #D87824, -1px -1px 35px 1px #D87824; }
*更新：需要供应商前缀是我的一个错误。我再次下载了两个浏览器并重新安装，现在 box-shadow 和 border-radius 在所有四个浏览器上都可以使用（当我离开默认的“购买 Apple 东西”页面时，Safari 会崩溃，否则我也会对其进行测试） . 我将在几秒钟内更新此处和 Fiddle 上的 CSS。再见，笨蛋...