I'm struggling to create a bootstrap card with a logo perfectly centered, but the logo seems fixed at the top. How can I fix this issue?
<div class="col-xl-3 col-md-6">
<div class="card mini-stat">
<div class="card-body text-center" style="height:10em">
<img src="public/assets/images/entrylogos/chromebook.png" class="card-img-top">
</div>
</div>
</div>
The following CSS class may be helpful:
.card-img-top {
max-width: 80%;
max-height: 80%;
object-fit: contain;
}
Any assistance would be greatly appreciated! Thank you in advance :-)