JSFiddle - React, Tailwind, and code Playground
HTML
<input type='button' id='minus'/>
<div class='range-container'>
<input id='range' type='range' min='0' max='100' step='1'/>
</div>
<input type='button' id='plus'/>
CSS
#plus {
width: 15px;
height: 15px;
background-color: red;
float: left;
}
#minus {
width: 15px;
height: 15px;
background-color: blue;
float: left;
}
.range-container {
float: left;
overflow: auto;
}
JavaScript
$('#plus').click(function() {
$('#range').val(parseInt($('#range').val()) + 1);
});
$('#minus').click(function() {
$('#range').val(parseInt($('#range').val()) - 1);
});