CSS-də Fleks Elementlər
Öyrəndiyimiz blok modellərinin tiplərindən əlavə
onlardan başqa biri də var - fleks elementlər. Bunun üçün,
bu elementlərin valideyninə
display xassəsini
flex dəyərində təyin etmək lazımdır.
Valideyn özü blok elementi olaraq qalacaq,
onun varisləri isə fleks elementlərinə çevriləcək.
Fleks elementlər, blok elementlər kimi
eni və hündürlüyü, margin və padding ola bilər.
Lakin, blok elementlərindən fərqli olaraq,
standart olaraq fleks elementlər öz valideyninin
daxilində sıra ilə düzülür.
Gəlin cəhd edək:
<div class="parent">
<div class="child">1</div>
<div class="child">2</div>
<div class="child">3</div>
</div>
.parent {
display: flex; /* varislər fleks elementləri olacaq */
width: 300px;
height: 200px;
border: 1px solid red;
}
.child {
width: 50px;
height: 50px;
border: 1px solid green;
}
: