JSFiddle - React, Tailwind, and code Playground
HTML
<div class="input-number">
<input type="text" value="1" id="@Html.Raw(mcq.sectionID)[email protected](mcq.GeneratorID)" name="@Html.Raw(mcq.sectionID)[email protected](mcq.GeneratorID)" />
<button type="button" class="input-number-increment" data-increment></button>
<button type="button" class="input-number-decrement" data-decrement></button>
</div>
CSS
body {
padding: 10px 20px 0 20px;
}
* {
padding: 0;
margin: 0;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
line-height: 1;
}
td {
padding: 0 0 10px 0;
}
.range {
text-align: right;
}
.value {
padding-left: 10px;
font-weight: bold;
text-align: left;
}