Почему не работает space-between?

Question

[Артём]

HTML

<section>
        <h2 class="title">Тарифные пакеты</h2>
        <p class="desc">Лучшее решение для игр - акционные пакеты!</p>

        <div class="card">
          <div class="card_item">
            <div class="card_cover">
              <img class="card_img" src="1.jpg" alt="Baza">
            </div>
            <div class="card_info">
              <div class="">
                <p class="card_title">Тариф "База"</p>
                <p class="card_desc">Подходит для игроков с менее боевым настроем играть!</p>
              </div>
              <p class="card_bid"><span class="card_price">700 ₽/сут</span></p>
            </div>
          </div>
        </div>
        <div class="card">
          <div class="card_item">
            <div class="card_cover">
              <img class="card_img" src="1.jpg" alt="Baza">
            </div>
            <div class="card_info">
              <div class="">
                <p class="card_title">Тариф "База"</p>
                <p class="card_desc">Подходит для игроков с менее боевым настроем играть!</p>
              </div>
              <p class="card_bid"><span class="card_price">700 ₽/сут</span></p>
            </div>
          </div>
        </div>
        <div class="card">
          <div class="card_item">
            <div class="card_cover">
              <img class="card_img" src="1.jpg" alt="Baza">
            </div>
            <div class="card_info">
              <div class="">
                <p class="card_title">Тариф "База"</p>
                <p class="card_desc">Подходит для игроков с менее боевым настроем играть!</p>
              </div>
              <p class="card_bid"><span class="card_price">700 ₽/сут</span></p>
            </div>
          </div>
        </div>
      </section>

CSS

.card{
  display: flex;
  justify-content: space-between;

}
.card_item{
  background: rgba(255, 255, 255, 0.1);
  border-radius: 10px;
  box-shadow: 0pz 5px 4px rgba(0, 0, 0, 0.25);
  padding: 26px;
  gap: 15px;
  flex-basis: 32%;
  box-sizing: border-box;
}
.card_cover{
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 380px;
}
.card_img{
  width: 100%;
  height: 380px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  object-fit: cover;
}

space-between не распределяет колонки по центру, не пойму в чем косяк

Comments

[Renat871]

Не до конца понятен вопрос. Если Вам нужно разместить по центру карточки, то сделайте .card__wrapper и для него напишите display:flex; justify-content:space-between;. Если надо поставить по центру текст из карточки, напишите для текста width:100%; text-align:center;. Должно помочь.

[Renat871]

мой господин, именно так я и написал. Кстати ответ тот же что и у Вас.

[Renat871]

мой господин, ну я за себя и отвечал. Я ни разу не сказал что никому не понятно. И какая разница уверен я или нет? Я написал два ответа потому что хорошо не понял вопрос, надеялся что человек просто конкретизирует и я помогу. Зачем раздувать скандал?