How to use bootstrap cards next to each other?

Question

I am using 'class="card-group"' in bootstrap to make four cards to appear next to each other or to appear together in somethings like a row but i can not make it.

Answer 1

You can also use bootstrap's grid, make a row and divide it, example :

<div class="row">
    <div class="col-sm-6">Card 1</div>
    <div class="col-sm-6">Card 2</div>
</div>

See here for more details on this: Grid system - Bootstrap

Answer 2

Just add .card {display:inline-block;} to make them display in a line.

This is the official way according to the docs: https://v4-alpha.getbootstrap.com/components/card/#card-columns