CSS හි flex ආකෘතියේ තනි අංගයක පෙළගැස්ම
අපි අධ්යයනය කරන ඊළඟ ගුණාංග,
ඒවා නොවේ flex අංගවල දෙමාපියන් වෙත
මනසටම කරුණු. අපි දෙස බලමු
aling-self, පැතිකඩය දිගේ වෙන් වශයෙන්
කොටසක් පෙළගසයි.
අපට ඇතිවේවා flex කොටස්, පේළියකට සකස් කරන ලද.
සිරස් අතට මධ්යයට පෙළගස්වන්න,
align-items වටිනාකමෙහි center,
දෙවන අංගයට අතිරේක පන්තියක් දෙන්න
elem සහ ඒ සඳහා වෙනත් පෙළගැස්මක් සකසන්න,
උදාහරණයක් ලෙස, එය ඉහළ දාරයට තද කරන්න.
මේ සඳහා අපගේ පන්තියෙන් අංගය elem
ගුණය සකසන්න aling-self වටිනාකමට
flex-start:
<div class="parent">
<div class="child">1</div>
<div class="child elem">2</div>
<div class="child">3</div>
<div class="child">4</div>
<div class="child">5</div>
</div>
.parent {
display: flex;
align-items: center;
width: 300px;
height: 200px;
border: 1px solid red;
}
.child {
width: 50px;
height: 50px;
border: 1px solid green;
}
.elem {
align-self: flex-start;
}
: