Как мне сделать мой ряд отзывчивым, чтобы на мобильном телефоне он был вертикальным? - PullRequest
0 голосов
/ 19 февраля 2019

Я пытаюсь сделать ряд реагирующим так, чтобы мобильные ряды шли вертикально, а не горизонтально, и у меня все еще есть все эти причудливые рамки, кто-нибудь может мне чем-нибудь помочь?

Я уже пытался изменитьколонки вверх, css-flexbox, но я, скорее всего, просто делаю что-то ужасно неправильно.

#caixas {
  background-color: #58373791;
  padding-top: 5px;
  padding-right: 30px;
  padding-bottom: 5px;
  padding-left: 25px;
}

#caixas2 {
  background-color: #b6696a91;
  padding-top: 5px;
  padding-right: 30px;
  padding-left: 25px;
  padding-bottom: 5px;
}

#border {
  border: solid 3px red;
}
<div class='col-lg-12 col-md-12 col-sm-12'>
  <div id="border" class="container">
    <div class="row">
      <div class="col-lg-4 col-sm-6 mb-4">
        <div id="caixas" class="container">
          <h3 class="h2sm" align="center">Estudante </h3>
          <h4 class="h1sm " align="center">Português</h4>
        </div>
        <div id="caixas2" class="container">
          <h3 class="h3sm" align="center">Portuguese Student</h3>
        </div>
      </div>
      <div class="col-lg-4 col-sm-6 mb-4">
        <div id="caixas" class="container">
          <h3 class="h2sm" align="center">Estudante </h3>
          <h4 class="h1sm " align="center">Internacional</h4>
        </div>
        <div id="caixas2" class="container">
          <h3 class="h3sm" align="center">Internacional Student</h3>
        </div>
      </div>
      <div class="col-lg-4 col-sm-6 mb-4">
        <div id="caixas" class="container">
          <h3 class="h2sm" align="center">Estudante </h3>
          <h4 class="h1sm " align="center">Intercâmbio</h4>
        </div>
        <div id="caixas2" class="container">
          <h3 class="h3sm" align="center">Exchange Student</h3>
        </div>
      </div>
    </div>
  </div>
</div>
...