CSS3 double rounded border, is it possible without 2 divs?

问题

I was wondering if it was possible to create a double rounded border without nesting DIV's?

See my example here: http://jsfiddle.net/eXDjL/

The first box is rounded, but the ouline stays square, the second box has no rounded corners but shows the borders how I want them.

I know there is a -moz-outline-radius property, but anything for the other browsers?

If not I guess I'll just stick with two divs.

回答1:

To mimic different color borders you can use box-shadow - http://jsfiddle.net/eXDjL/3/

.genyx_content_full {
    background-color:#f7f7f7;
    border: #fff 1px solid;
    padding: 10px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    box-shadow: 0px 0px 0px 1px #dedede;
}

来源：https://stackoverflow.com/questions/11313593/css3-double-rounded-border-is-it-possible-without-2-divs