CSS හි Flex අංග

අප අධ්‍යයනය කරන ලද බ්ලොක් ආකෘති වර්ග වලට අමතරව තවත් එකක් තිබේ - flex අංග. මෙම අංග ලබා ගැනීමට, එම අංගවල මාපිය ට display දේපල ලිවීමට අවශ්‍ය වේ flex අගයෙන්. මාපිය අංගය බ්ලොක් අංගයක් ලෙසම පවතිනු ඇත, නමුත් එහි පරම්පරාව flex අංග බවට පත්වේ.

Flex අංග, බ්ලොක් අංග මෙන් පළල සහ උස, margin සහ padding තිබිය හැක. කෙසේ වෙතත්, බ්ලොක් අංගවලට වඩා, පෙරනිමිය ලෙස flex අංග ඒවායේ මාපිය අංගය තුළ පේළියකට සකස් වේ.

අපි උත්සාහ කරමු:

<div class="parent">
	<div class="child">1</div>
	<div class="child">2</div>
	<div class="child">3</div>
</div>

.parent {
	display: flex; /* පරම්පරා flex අංග වනු ඇත */
	width: 300px;
	height: 200px;
	border: 1px solid red;
}
.child {
	width: 50px;
	height: 50px;
	border: 1px solid green;
}