شرح صفوف ومحتوى الفقرة
- يضاف كلاس me-auto الى child element لعمل هوامش بينه وبين العناصر التي تليه حيث يقوم بمحاذاة هذه العناصر ناحية اليمين.
- يضاف كلاس ms-auto الى child element لعمل هوامش لعمل هوامش بينه وبين العناصر التي تسبقه حيث يقوم بمحاذاة هذه العناصر ناحية اليسار.
- يضاف كلاس mb-auto الى child element في حالة flex-column لعمل هوامش بينه وبين العناصر التي تليه حيث يقوم بمحاذاة هذه العناصر الى الاسفل.
- يضاف كلاس mt-auto الى child element في حالة flex-column لعمل هوامش بينه وبين العناصر التي تسبقة حيث يقوم بمحاذاة هذه العناصر الى الاعلى.
Auto Margins
عمل هوامش تلقائية في flexbox.
HTML
<!-- me-auto -->
<div class="d-flex text-white mb-3">
<div class="p-2 me-auto bg-primary">Flex Item</div>
<div class="p-2 bg-primary">Flex Item</div>
<div class="p-2 bg-primary">Flex item</div>
</div>
<!-- ms-auto -->
<div class="d-flex text-white">
<div class="p-2 bg-primary">Flex item</div>
<div class="p-2 bg-primary">Flex item</div>
<div class="p-2 ms-auto bg-primary">Flex item</div>
</div>