title: JavaFX 8 scroll bar css
body: <p>I am using the following css to customize my scrollbars</p>
  
  <pre><code>/* The main scrollbar **track** CSS class  */
  .workspace-grid .scroll-bar:horizontal .track,
  .workspace-grid .scroll-bar:vertical .track{
      -fx-background-color:transparent;
      -fx-border-color:transparent;
      -fx-background-radius: 0em;
      -fx-border-radius:2em;
  }
  
  /* The increment and decrement button CSS class of scrollbar */
  .workspace-grid .scroll-bar:horizontal .increment-button ,
  .workspace-grid .scroll-bar:horizontal .decrement-button {
      -fx-background-color:transparent;
      -fx-background-radius: 0em;
      -fx-padding:0 0 10 0;
  
  }
  
  /* The increment and decrement button CSS class of scrollbar */
  
  .workspace-grid .scroll-bar:vertical .increment-button ,
  .workspace-grid .scroll-bar:vertical .decrement-button {
  
      -fx-background-color:transparent;
      -fx-background-radius: 0em;
      -fx-padding:0 10 0 0;
  
  }
  
  .workspace-grid .scroll-bar .increment-arrow,
  .workspace-grid .scroll-bar .decrement-arrow
  {
      -fx-shape: " "; 
      -fx-padding:0;
  }
  
  /* The main scrollbar **thumb** CSS class which we drag every time (movable) */
  .workspace-grid .scroll-bar:horizontal .thumb,
  .workspace-grid .scroll-bar:vertical .thumb {
      -fx-background-color:derive(black,90%);
      -fx-background-insets: 2, 0, 0;
      -fx-background-radius: 2em;
  
  }
  </code></pre>
  
  <p>But my scrollbars looks like following</p>
  
  <p><a href="https://i.stack.imgur.com/uDS4P.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/uDS4P.png" alt="enter image description here"></a></p>
  
  <p>How to make the scrollbars looks like following</p>
  
  <p><a href="https://i.stack.imgur.com/RULXO.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/RULXO.png" alt="enter image description here"></a></p>
  
  <p>EDITED</p>
  
  <p><a href="https://i.stack.imgur.com/RlJJp.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/RlJJp.png" alt="enter image description here"></a></p>