HTML - Center cards

Question

I have a little problem. I don't know how to center (img) cards. I've tried many codes and nothing happens.

Does this answer your question? https://stackoverflow.com/questions/7273338/how-to-vertically-align-an-image-inside-a-div — JLeno46, Nov 20 '20 at 11:12

score 2 · Accepted Answer · answered Nov 20 '20 at 08:45

2

How do you want to center them? One option is with flex box. give the parent element class of .flex-container and do this:

.flex-container {
  display: flex;
  justify-content: center;
}

answered Nov 20 '20 at 08:45

Aleksandar

score 0 · Answer 2 · answered Nov 20 '20 at 08:51

0

The one i use mostly is:


.card-container {
    display: grid;
    place-items: center;
}

This places all the items inside the .card-container in the middle.

answered Nov 20 '20 at 08:51

gospecomid12

score 0 · Answer 3 · answered Nov 20 '20 at 08:54

0

If you need a centered into your row, Add css like this in <div class="row ...">

.justify-content-center {
-webkit-box-pack: center !important;
    -ms-flex-pack: center !important;
        justify-content: center !important;
}

answered Nov 20 '20 at 08:54

Adhitya

3 Answers3