HR Styling - Only working in Firefox, how to make it work for IE and Chrome

Question

I have this code

<hr style="margin-top: 5px; color: #ada95b; width: 500px;"/>

However this is only working in Firefox, and not working on my versions of Chrome and IE. What way is best to style them and they will work in all browsers?

Answer 1

best way is removing the border and putting a color to background.. i.e.

<hr style="margin-top: 5px; height: 2px; border: none; background: #ada95b; width: 500px;"/>

Answer 2

Regarding the color, browsers treat it differently, you should also set background-color.

This is a quite old article, but might still help.

http://www.sovavsiti.cz/css/hr.html

You can also get some ideas here:

http://webdesign.about.com/od/beginningcss/a/style_hr_tag.htm