有没有办法在框外（div）有CSS边框？或替代解决方案

Question

我这里有这个菜单

我希望突出显示（悬停）延伸到外部框（服务菜单）的边缘。就像弹出菜单一样。菜单本身包含在另一个div中 -

我认为不能像负填充一样使用负边框。

任何人都知道如何在悬停时将菜单的突出显示扩展到外部框的边缘？

顺便说一下，这是Drupal w / Nice Menu。

Answer 1

看起来像边距问题，尝试将边距更改为填充，应该几乎完全相同并转到边缘。

编辑或将out div的宽度设置为与内部div相同。

Answer 2

您应该使用box-sizing属性：

-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */

这将使边框和填充符合元素尺寸而不是外部。

Answer 3

结合使用CSS BOX模型和轮廓。

保证金：

padding:
border: line-size style color;
outline:line-size style color;
box-sizing:border-box (webkit);

示例：

padding:2px;
margin:0;
border: 1px solid grey;
outline: 1px solid grey;
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */