Jitendra Vyas Jitendra Vyas - 1 month ago 6
CSS Question

How to make double lines border in CSS, each line in different color, without using background image?

How to make a double line border in CSS, each line in a different color without using


For example like this:

enter image description here


<h2> heading 2 </h2>
<p> paragraph text </p>

<h2> heading 2 </h2>
<p> paragraph text </p>

Note: I'm not considering IE 8, 7, 6


I just found the way on google search and it's working good for me.

h2 {
    border-bottom: 1px solid blue;
    box-shadow: 0 1px 0 red;}

Source : http://www.cvwdesign.com/txp/article/425/useful-tip-for-creating-double-borders-with-css3

Edit : I found another way to achieve multiple border using CSS 2.1 pseudo-elements

Support: Firefox 3.5+, Safari 4+, Chrome 4+, Opera 10+, IE8+