Problema com redimensionamento Bootstrap

Opa!
Estou com um problem fiz um Card usando bootstrap, porém quando vejo a versão mobile fica totalmente fora dos eixos. Alguém poderia me ajudar?

    <div class="card">
    <div class="card-horizontal">
        <div class="img-square-wrapper">
            <img class="" src="http://via.placeholder.com/300x180" alt="Card image cap">
        </div>
        <div class="card-body">
            <h4 class="card-title">Card title</h4>
            <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
        </div>
    </div>
    <div class="card-footer">
        <small class="text-muted">Last updated 3 mins ago</small>
    </div>
</div>


.card-horizontal {
  display: flex;
  flex: 1 1 auto;
}

Quando removo o “display: flex;” no mobile fica ok, porém a imagem vai para o centro. Help.

up

Boa tarde,
tente no seu css fazer @media screen.

https://www.w3schools.com/cssref/css3_pr_mediaquery.asp

Valeu! Foi, obrigadão!

1 curtida