Css ufak bir sorun

merhaba ufak bir sorunum varda ilk ssde gözüktüğü gibi sayfayı soldan sağa tamamen kaplıyor ama ben 2.ssde olduğu gibi yanlarını boş bırakmak istiyorum hiç bir şekilde bulamadım 2 dosyanında kodları var ama bunu nasıl yapıalcağını hala anlayamadmı yanlardan nasıl boşluk bırakabilirim float ile yaptım 2 kodda width %33 şeklinde

Container içine al hocam

Arkadaşın dediği Gibi container içerisine alıp row eklersen biraz kurcalıyıp yapabilirsin yada row oluşturup col-md-12 6 4 gibi kodlar kullanırsan işin çözülebilir

3 box da tek bir section içinde zaten ama

İlgili kapsara max genişlik 1400 px ver

Bootstrap yoksa;

<div class="container">
<div class="col">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magni aut maiores sed voluptatem esse natus doloribus dolores odio ut inventore ullam numquam voluptate, delectus, quae vel culpa cupiditate alias praesentium.</div>
<div class="col">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magni aut maiores sed voluptatem esse natus doloribus dolores odio ut inventore ullam numquam voluptate, delectus, quae vel culpa cupiditate alias praesentium.</div>
<div class="col">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Magni aut maiores sed voluptatem esse natus doloribus dolores odio ut inventore ullam numquam voluptate, delectus, quae vel culpa cupiditate alias praesentium.</div>
  </div>

.col{
width:33%;

}
.container{
    display: flex;
    max-width: 80%;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    margin: 0 auto;

}

section içinde class olarak container verebilirsin hepsini eğer for döngüsü yoksa yada while döngüsü yok ise ayırabilirsin

çok teşekkürler max-width işimi çözdü aynı zamanda containere padding ile değer verilincede yapılıyormuş container açıp deneyince farkettim tekrar teşekkürler

padding responsive'de sorun çıkarır hocam width ya da max-width değerini % olarak verirseniz daha iyi olur, kolay gelsin.