Pure CSS Airmail Ribbon
by Cam Gould
HTML
<div id="ribbon"></div>
CSS
/* RIBBON */
#ribbon {
position: absolute;
top: 3px;
left: 12px;
width: 7px;
height: 1px;
background: #c03c41;
/* Skew */
-webkit-transform: skew(45deg);
-moz-transform: skew(45deg);
-o-transform: skew(45deg);
transform: skew(45deg);
/* Repeat */
box-shadow:
0px 0px 0 4px #c03c41,
30px 0px 0 4px #4567ae,
60px 0px 0 4px #c03c41,
90px 0px 0 4px #4567ae,
120px 0px 0 4px #c03c41,
150px 0px 0 4px #4567ae,
180px 0px 0 4px #c03c41,
210px 0px 0 4px #4567ae,
240px 0px 0 4px #c03c41,
270px 0px 0 4px #4567ae,
300px 0px 0 4px #c03c41,
330px 0px 0 4px #4567ae,
360px 0px 0 4px #4567ae;
filter : alpha(opacity=60);
-khtml-opacity : 0.6;
-moz-opacity : 0.6;
opacity : 0.6;
}