Tepat di Tengah

Pelajaran 11 dari 15 dalam kursus CSS Flexbox: Kursus Lengkap di Coddy.

Salah satu masalah yang paling umum adalah memusatkan elemen secara horizontal dan vertikal di dalam container. Dengan flexbox, tugas ini mudah!

Tantangan

Mudah

Dengan menggunakan apa yang sudah kamu pelajari, posisikan item flex yang diberikan di tengah container flex.

Coba sendiri

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <div class="container">
            <div />
        </div>
    </body>
</html>

Semua pelajaran di CSS Flexbox: Kursus Lengkap

1Pengenalan

Pengenalan Wadah dan Item

2Kontainer Flex

Flexbox flex-direction flex-wrap flex-flow justify-content align-items align-content gapTepat di Tengah

3Item Flex

Elemen Anak order flex-grow align-self

Latihan sendiri: Playground Web