Min/Max attributes don't work as you type, they only work for the arrows/wheel. Tiny bit of js fixes that.

<input type="number" min="0" max="23" value="14" onkeyup=enforceMinMax(this)>

<script>
function enforceMinMax(el) {
  if (el.value != "") {
	if (parseInt(el.value) < parseInt(el.min)) {
	  el.value = el.min;
	}
	if (parseInt(el.value) > parseInt(el.max)) {
	  el.value = el.max;
	}
  }
}
</script>

You could use jquery show to display a message if it goes out of range, maybe a reminder what the ranges should be.