Internet Explorer and most CSS-compliant browsers (e.g., Webkit- and Gecko-based ones—Opera has one quirk which Stefan M. Huber has documented) treat the styling of horizontal rules differently. Essentially, IE (versions less than 8) treats them as inline elements, while the others treats them as block elements.As such, to colour it red…

Internet Explorer:

HR { color: #F00; }

Other CSS-compliant browsers:

HR { background-color: #F00; }

The same is true for alignment:

Internet Explorer:

HR { text-align: right; }

Other CSS-compliant browsers:

HR { margin-right: 0; }

To accomplish in CSS what in HTML would look like…

<hr align="right" width="30%" size="2" color="#000F00" noshade>

…you can do:

hr { text-align: right; width: 30%; height: 2px; color: #F00; border: none; } /* For Internet Explorer */
html>body hr { margin-right: 0; width: 30%; height: 2px; background-color: #F00; border: none; } /* For Gecko-based browsers */
html>body hr { margin-right: 0; width: 30%; height: 2px; background-color: #F00; border: 0px solid #F00; } /* For Opera and Gecko-based browsers */

For more on styling horizontal rules, read Marek Prokop’s “Styling <hr>”