Sometimes, we want to make label and input appear on the same line on an HTML form.
In this article, we’ll look at how to make label and input appear on the same line on an HTML form.
How to make label and input appear on the same line on an HTML form?
To make label and input appear on the same line on an HTML form, we use flexbox.
For instance, we write
<div class="form-group" style="display: flex">
<label>Comment:</label>
<input class="form-control" type="checkbox" />
</div>
to make the div a flex container with display: flex
.
Then the label and input will appear side by side.
Conclusion
To make label and input appear on the same line on an HTML form, we use flexbox.