I am currently building a web application using Express JS with Bootstrap 4 styling for the front-end.
There are no custom stylesheets used in this project.
Here is my HTML code featuring Bootstrap 4 styling:
<div class="container">
<div class="row text-center">
<div class="col-sm-6">
<div class="grid-container">
<div><a class="btn btn-primary btn-lg btn-block" href="items/addItem">Add a New Item</a></div>
</div>
</div>
... // Additional code continues here
</div>
</div>
The issue I am facing is that I need to center the text within each DIV element in the grid-container, but they are all currently aligned at the top as shown in the screenshot below.