Biz o'rgangan blokli modellarning turlariga qo'shimcha ravishda yana bir bor - moslashuvchan elementlar. Bunday elementlarni olish uchun ushbu elementlarning ota-onasi displey xususiyatini moslashuvchan qiymatga o'rnatishi kerak. Ota-onaning o'zi blok elementi bo'lib qoladi, lekin uning bolalari moslashuvchan elementlarga aylanadi.
Blok elementlari kabi moslashuvchan elementlar kenglik va balandlik, chekka va to'ldirishga ega bo'lishi mumkin. Biroq, blok elementlaridan farqli o'laroq, sukut bo'yicha moslashuvchan elementlar ota-onalari ichida joylashgan.
Keling urinib koramiz:
<div class="parent">
<span class="child">text</span>
</div>
.parent {
display: flex; /* потомки будут флекс элементами */
width: 300px;
height: 200px;
border: 1px solid red;
}
.child {
width: 50px;
height: 50px;
border: 1px solid green;
}
Kodni bajarish natijasi: