Problem z flexboxem

Question

Witam, 

Już od pewnego czasu prowadzę naukę HTML i CSS. Postanowiłem stworzyć portfolio za pomocą Flex-box'a, jednak napotkałem pewien problem - przy floatach wiem , że można używać wrappera, a jak to jest z flexem? Rozwala mi się cała sekcja, tutaj wrzucam kod

Github

Ps. chciałbym uzyskać efekt, w którym 3 divy ''services-box'' są poziomo wycentrowane i mam możliwość zmiany tła sekcji ''services'', która ma 100% width.

Answer 1

Flex powinien być wraperem. Gdy dajesz display flex do elementu który ma tylko jedno dziecko nic się nie zmieni. Sekcja rozwala ci się przez to ze określiłeś wysokość na stałe. Usuń height i powinno być w miarę ok. 

Do nauki flexboxa polecam : https://flexboxfroggy.com/#pl

Answer 2

Jak chcesz dodać wrapper, to nie możesz dać flexboxa na services, a musisz na wrapper.

W swoim kodzie zamień na:

.services {
    width: 100%;
    background-color: black;
}
.services .wrapper {
    display: flex;
    justify-content: space-between;
}

 

Comments

Dziękuję,rozwiązało to mój problem, zrobię cały projekt i wrzucę do oceny. Pozdrawiam