Trey_23 Trey_23 - 6 months ago 8
CSS Question

How do I fill an <hr> divider in CSS with a color?

webpage with hr divider

I have a webpage with an hr divider and tried adding a color to it in my CSS file however no modifications seem to be working. Can someone help.

Here is my CSS file code:

body {
background: linear-gradient(black,white);
text-align:center;
}
#main {
width: 1000;
height: 600px;
background: linear-gradient(gold, white);
margin: 25px auto;
border: solid 4px #FFFFFF;



}
h1 {

text-align: center;
font-family:"Times New Roman";
font-size: 40pt;
color: black;



}
hr{

height: 6px;
color: black;
}

Answer

You have to use background-color to fill an HR.

hr {
    height: 6px;
    background-color: black;
}