I have a jquery UI range slider with a range of 0-500 and a step size of 50. When I drag the right most edge of the slider to the left it leaves a line to the right hand side of the slider as if it did not repaint properly. I'm using chrome. The code for the example is shown below and I've included a link to the jsfiddle that shows the issue.
If I change the step size to something that does't divide evenly then I don't have this issue. Does anyone know why this is happening?
<html>
<body>
<div id="slider-range"></div>
<script>
$(function() {
$( "#slider-range" ).slider({
range: true,
min: 0,
max: 500,
step: 50,
values: [ 0, 500 ]
});
$( "#slider-range" ).width(150);
})();
</script>
</body>
</html>
