JSFiddle - React, Tailwind, and code Playground
HTML
sapi<input type="text" class="number" pattern="^\d*(\.\d{0,2})?$"/>
CSS
.number {
padding: 5px 10px;
font-size: 16px;
}
JavaScript
$('.number').keypress(function(event) {
if(event.which < 46
|| event.which > 59) {
event.preventDefault();
} // prevent if not number/dot
if(event.which == 46
&& $(this).val().indexOf('.') != -1) {
event.preventDefault();
} // prevent if already dot
if(parseInt(event.target.value) > 99){
event.target.value = 100
/* $('.number').val('100') */
event.preventDefault();
}
});