css - CSS：重叠边框

Question

我只是偶然发现了一个问题，菜单栏和主内容框之间的共享边框不能正常进行（因为内容框太小）

图片：http: //imgur.com/O3ra9

代码：http: //jsfiddle.net/gh55e/2/

所以我想知道是否有办法修复边界。也许通过给他们一个并使其重叠？只是不知道如何做到这一点，因为 margin -x 不起作用。

Answer 1

给右边的元素一个边框，然后使用底片中的 margin-top 和 margin-left 属性使它们重叠。这是一个更新的jsfiddle：

http://jsfiddle.net/gh55e/4/

CSS：

#right {
    width: 85px;
    float: right;
    background-color: #e1e1e1;
    padding: 0px 10px 10px 10px;
    margin-top: -54px;
}
​

Answer 2

对于后来的访问者，这是最终修复它的 CSS。

#right {
    width: 385px;
    float: right;
    background-color: #e1e1e1;
    padding: 0px 10px 10px 10px;
    margin-left: -10px;
}

你基本上留出 10 像素的边距并将其向后移动 10 像素