html - 边框顶部与左右边框冲突？

Question

我有这样的 HTML：

<style>
#footer{
width: 777px;
padding: 20px 24px;
background: white;
margin: 0px auto 25px;
border-right: 1px solid #eee;
border-left: 1px solid #eee;
border-top: 12px solid #bbb;
background: #fbfbfb;
}
</style>
<div id='footer'></div>

可以看到：上边框的一半没有正常显示（jsfiddle）。那么，解决方案呢？（不要再创建div了。）

Answer 1

好的，根据您不添加元素的要求，我想出了一个解决方案，只是为了好玩。

#footer:before{
  content:"";
  display:block;
  width:349px;
  height:20px;
  background:#BBB;
  position:absolute;
  top:0px;
  left:0px;
 }

http://jsfiddle.net/zyglobe/xf7sa/2/