Center align a card


Topic: Center align a card

folliejester asked 7 months ago

Expected behavior : A center aligned card enter image description here

Actual behavior : A top aligned card enter image description here

Resources (screenshots, code snippets etc.)

<div class="card">
  <div class="card-body">
    <h5 class="card-title">Card title</h5>
    <iframe src="https://radio.syden.xyz/public/jpop/embed?theme=dark" frameborder="0" allowtransparency="true" style="width: 100%; min-height: 150px; border: 0;"></iframe>
    <button type="button" class="btn btn-primary">Button</button>
  </div>
</div>

folliejester answered 7 months ago

fix : <div class="vh-100 d-flex justify-content-center align-items-center">


Grzegorz Bujański staff answered 7 months ago

I can see that you have solved the problem, right?


folliejester answered 7 months ago

I updated it to a horizontally centered card, and I need help making it vertically centered. https://syden.xyz/radio (don't use your phone to open)


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: MDB Standard
  • MDB Version: MDB5 3.10.1
  • Device: Desktop Computer
  • Browser: Firefox
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No