title: Change y-axis (horizontal) scrollbar styles
body: <p>I want to change the horizontal scrollbar styles of a div.</p>
  
  <p>I successfully changed the x-axis (vertical) scrollbar style but when I added y-axis scroll, it is taking same styles as I added for the y-axis. </p>
  
  <p>I want to style both scrollbars differently. Is there any possible way to make this happen?</p>
  
  <p>Current CSS for (x-axis) vertical scrollbar:</p>
  
  <pre><code> .list-group {
      overflow-y: scroll;
      max-height:  335px;
      border: 1px solid #bdbdbd;
      padding: 10px;
  }
  .list-group::-webkit-scrollbar {
      width:35px;
  }
  .list-group::-webkit-scrollbar-button:increment {
      background-image: url('../images/arrow down.png');
      background-repeat: no-repeat;
      height: 30px;
      border-bottom: 2px solid transparent;
  }
  
  
  .list-group::-webkit-scrollbar-button:decrement {
      background-image: url('../images/arrow up.png');
      background-repeat: no-repeat;
      height: 30px;
      border-top: 10px solid transparent;
  }
  </code></pre>