HR and borders in CSS

[swwalters]

I have developed a habit of designing my webpages with rules to separate content. For my vertical rules I usually use a 1px image from photoshop and set it to whatever height I need it to be. For my vertical rules I use HR defined in CSS or nowadays I start using borders like bottom border etc.

Is there a better way to use CSS to get the vertical rules on a page without having to create a graphic. I guess I am thinking that I can use the same borders. But how do I set it up where it is a good distance from the text and can the rule be longer than the text for example on this sample website:

http://templates.entheosweb.com/template_number/11340.asp

Thanks for your help.

[ray326]

Separation from the content can be done with padding. Look at how they styled #left.

[swwalters]

Thank you. I will try that.