styling additional <hr> tag?

css, styling

Solution

use

hr.side { border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 22px 0 21px; height: 0; }

then

<hr class="side">

in css the `.` refers to a class , and `#` to id

EDIT:

if you really really wanted to do inline styling with `style=""` then it would look like this

<hr style="border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 22px 0 21px; height: 0;">

This last method is not really the recommended way, but works great if you want to override all css style sheets, and also override any `<style> </style>` tags that are embedded in HTML page

Problem

I am looking to style an additional `<hr>` tag for my side-bar on my website. How might I be able to do this if I already have an hr defined? ``` hr { border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 22px 0 21px; height: 0; } ``` Could I add a style? ``` hr.side { border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 22px 0 21px; height: 0; } ``` so html would be `<hr class="side">` ?

Original source