Topic: How to align md cards horizontally in <ul> using <li> elements?

I want to align cards horizontally using *ngFor tags in <li>, but somehow they keep aligning vertically. How do I align them? The link to my code is The cards will be received from the server and I want to align 3 cards in a row until I receive them from the server. How do I make it possible?

Rafał Rogulski free answered 5 years ago

Hi,   It's possible with flexbox, more information you can find here:   Regards  

Suraj Singh Bora , B.Tech., Mech. Engg., IIT (BHU), Varanasi (INDIA) free commented 5 years ago

Thank you, sir, for introducing me to flexbox. It is amazing. But I am facing another problem aligning card's image and card's content horizontally using flexbox. How do I perform this task?

Rafał Rogulski free commented 5 years ago

Give your li elements displa: flex and justify-content: center; this should work

Please insert min. 20 characters.


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



Specification of the issue

  • User: Free
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: Yes