Using the :after selector and the content property, you can create great looking underlines, seperators, etc without images.
Check out this underline!
As always, exact positioning varies from browser to browser, as well as font to font, so the positining of the :after and the placment of the text-shadow will need to be tweaked on an individual basis.
.example {
border-bottom: 2px solid #000;
position: relative; }
.example:after {
font-family: Helvetica, Arial, sans-serif;
content: "~";
position: absolute;
top: .2em;
font-size: 2em;
left: 45%;
text-shadow: 5px -1px 0 #fff, -5px 1px 0 #fff, 0 2px 0 #fff, 0 -2px 0 #fff; }