title: firefox - customize scroll bar
body: <p>i have the following code that customizes a webkit scroll bar....</p>
  
  <pre><code>/*webkit scroll bar*/  
  
  ::-webkit-scrollbar {
      width: 6px;
  }
  
  
  ::-webkit-scrollbar-track {
      -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
      -webkit-border-radius: 10px;
      border-radius: 10px;
  }
  
  
  ::-webkit-scrollbar-thumb {
      -webkit-border-radius: 10px;
      border-radius: 10px;
      background: rgba(255,0,0); 
      -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
  }
  ::-webkit-scrollbar-thumb:window-inactive {
      background: rgba(255,0,0); 
  }
  </code></pre>
  
  <p>what i would like to do is customize the scrollbar of a page loaded in firefox the same way... for which i tried the following code..</p>
  
  <pre><code>/*mozilla scroll bar*/  
  
  ::-moz-scrollbar {
      width: 6px;
  }
  
  
  ::-moz-scrollbar-track {
      -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
      -webkit-border-radius: 10px;
      border-radius: 10px;
  }
  
  
  ::-moz-scrollbar-thumb {
      -webkit-border-radius: 10px;
      border-radius: 10px;
      background: rgba(255,0,0); 
      -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
  }
  ::-moz-scrollbar-thumb:window-inactive {
      background: rgba(255,0,0); 
  }
  </code></pre>
  
  <p>but it does not work..... how can i customize the scrollbar in the same way i did for webkit... any help would be appreciated... thanks in advance... :)</p>