Размещение Divs «inline» в Bootstrap

Question

Я использую Bootstrap, и у меня возникают проблемы с размещением двух разделов рядом друг с другом. Я пробовал дисплей: inline, и это делает его еще хуже. Я создал div, чтобы держать их обоих как steven-and-leah и получил тот же результат, однако, если использовать определенный тип встроенного текста, например inline-flex Я получаю результат, который находится рядом с тем, что я хочу, но они слишком близко друг к другу и не могут быть разделены при использовании этого.

Прошу прощения, если это недостаточно, но я не замечаю ничего, что даже влияет на код.

.steven-and-leah{ 
    display: inline; 
} 

.team-bx{ 
    width: 500px; 
    height: 570px; 
    margin-top: 80px; 
    border: 5px solid #FFF; 
    border-radius: 120px; 
    padding: 20px 0px 20px 0px; 
    overflow: hidden; 
    background-color: #111924; 
} 

Answer 1

Вы с помощью начальной загрузки здесь не так. Помните, что сила Bootstrap находится на его сетке.

Если вы хотите разместить два div друг рядом с собой, вам просто нужно применить col-6 -6 к ним (£ - устройство, на которое вы хотите настроить таргетинг). Например:

<div class="row"> 
<div class="col-md-6">div number one!</div> 
<div class="col-md-6">div number two!</div> 
</div> 

Это автоматически переведет оба дивы рядом друг с другом, как если бы они были «инлайн», с огромным плюсом из них автоматически реагировать.

Если это не ваш вопрос, пожалуйста, переформулируйте его.

Вы можете найти отличные примеры в их getting started сайте

Answer 2

Пробовал ли вы это. проверить демо

.steven-and-leah > * { 
    display: inline-block; 
} 

Demo