Как сделать два блока с текстом на одном уровне

Question

Здравсвуйте, есть два блока, где 1 - поле, а 2 - значения поля. Нужно выровнять так, чтобы 1 и 2 было по центру, ответы начинались ровно друг под другом + значения аналогично + название поля должно быть на одном уровне с ответом. Не уверен, что нормально обьяснил, так что прилагаю скриншот того, что я имею ввиду:

Если можно решить это частично bootstrap, то было бы отлично

Answer 1

Можете попробовать сделать это с помощью display:flex

.block_items {
    width: 80%; 
    padding: 10%;     
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    gap: 1rem;
    }
    .block_item {padding: 2rem;}
    .block_item:nth-child(1) {background-color: aquamarine;}
    .block_item:nth-child(2) {background-color: blueviolet;}

<div class="block_items">
  <div class="block_item">
    <p>First Name</p>
    <p>Last Name</p>
  </div>
  <div class="block_item">
    <p>Test</p>
    <p>Test</p>
  </div>
</div>

Соответственно у вас внешний div и два div внутренних основное выравнивание происходит во внешнем

БЛОГ НА HUSL

Как сделать два блока с текстом на одном уровне

Ответы (1 шт):