Combine solid and dashed border

css, html

Solution

Give your element a yellow border, then use a pseudo element to create the dashed border:

div {
    position: relative;
    border-bottom: 1px solid yellow;
}

div:after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    border-bottom: 1px dashed #666;
}

Here's the fiddle: http://jsfiddle.net/z8BSs/

Problem

I want to set a border to my block element as the following: I.e. I want to set a yellow solid border and black dashed border which located over the yellow solid. How to do it?

Original source