SOURCE CODE: Uize.Widgets.Slider.Css (view docs)

.`trackFull`, .`trackEmpty` {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  cursor: pointer;
}

.`knobGrip` {
  position: absolute;
  opacity: .8;
}

/*** different orientations ***/
  /*** horizontal ***/
    .`horizontal` .`knobGrip` {
      background: url(grip.png) 0 0 repeat;
    }

    /*** different sizes ***/
      /*** tiny ***/
        .`horizontal`.`tiny` .`knobGrip` {
          left: 7px;
          top: 4px;
          right: 7px;
          bottom: 4px;
        }

      /*** small ***/
        .`horizontal`.`small` .`knobGrip` {
          left: 5px;
          top: 7px;
          right: 5px;
          bottom: 7px;
        }

      /*** medium ***/
        .`horizontal`.`medium` .`knobGrip` {
          left: 9px;
          top: 8px;
          right: 9px;
          bottom: 8px;
        }

      /*** large ***/
        .`horizontal`.`large` .`knobGrip` {
          left: 10px;
          top: 10px;
          right: 10px;
          bottom: 10px;
        }

  /*** vertical ***/
    .`vertical` .`knobGrip` {
      background: url(grip.png) 0 0 repeat;
    }

    /*** different sizes ***/
      /*** tiny ***/
        .`vertical`.`tiny` .`knobGrip` {
          left: 4px;
          top: 7px;
          right: 4px;
          bottom: 7px;
        }

      /*** small ***/
        .`vertical`.`small` .`knobGrip` {
          left: 7px;
          top: 5px;
          right: 7px;
          bottom: 5px;
        }

      /*** medium ***/
        .`vertical`.`medium` .`knobGrip` {
          left: 8px;
          top: 9px;
          right: 8px;
          bottom: 9px;
        }

      /*** large ***/
        .`vertical`.`large` .`knobGrip` {
          left: 10px;
          top: 10px;
          right: 10px;
          bottom: 10px;
        }