Srikar Appal Srikar Appal - 12 days ago 7
CSS Question

How I change the thickness of my <hr> tag

I want to change the thickness of my horizontal rule in CSS. I know it can be done in HTML like so -

<hr size="10">


But I hear that this is deprecated. In CSS I tried using
height:1px
but it does not change the thickness. I want the
<hr>
line to be
0.5px
thick.

I am using Firefox 3.6.11 on Ubuntu

Answer

For consistency remove any borders and use the height for the <hr> thickness. Adding a background color will style your <hr> with the height and color specified.

In your stylesheet:

hr {
    border: none;
    height: 1px;
    /* Set the hr color */
    color: #333; /* old IE */
    background-color: #333; /* Modern Browsers */
}

Or inline as you have it:

<hr style="height:1px;border:none;color:#333;background-color:#333;" />

Longer explanation here

Comments