CSS标题边框问题

Question

让我的标题标记边框正确有点问题。

我的目标是1px底部边框，顶部有一个2px更暗的65px宽边框

这是我的代码，以及指向小提琴的链接

h1, h2, h3{
    border-bottom:1px solid #ddd;
}
h1:before, h2:before, h3:before{
   content: " ";
   position: absolute;
   bottom:0;
   z-index: -1;
   width:65px;
   border-bottom: 2px solid #666;
}

http://jsfiddle.net/o7thwd/rqN4z/

Answer 1

您可能需要将h标记设为绝对:before元素的相对父级。试试这个：

h1, h2, h3 {
   position:relative;
}

演示http://jsfiddle.net/BWT66/

Answer 2

http://jsfiddle.net/rqN4z/7/

你必须删除这一行

h1:before, h2:before, h3:before{
   bottom:0; //remove this
}