title: How do I fill an <hr> divider in CSS with a color?
body: <p><a href="http://i.stack.imgur.com/Urj2T.png" rel="nofollow">webpage with hr divider</a></p>
  
  <p>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. </p>
  
  <p>Here is my CSS file code:</p>
  
  <pre><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;
  }
  </code></pre>