Maybe I don't have it setup right? I've been looking at code for the past 3 hours so it's possible I'm over looking something. Either way I have this h3 in a div and I want it to be centered both horizontally and vertically, however only horizontal is working.
<div class="col-md-4">
<div class="align-items-center" style="background-image:url({{ uni.u_homepage_pic.url }}); background-repeat:no-repeat; width: 350px; height: 225px;">
<h3 class="text-center" style="color:#ffffff;">{{ uni.u_name }</h3>
</div>
</div>
Update: Using Bootstrap V4
.align-items-center {
display: flex;
align-items: center; /*Aligns vertically center */
justify-content: center; /*Aligns horizontally center */
}
<div class="col-md-4">
<div class="align-items-center" style="background:red; width: 350px; height: 225px;">
<h3 class="text-center" style="">Hello</h3>
</div>
</div>
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments