Trey_23 Trey_23 - 1 year ago 74
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);
#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;


height: 6px;
color: black;

Answer Source

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

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