9- Flex in Tailwind CSS (1) [Arabic] | (1) Tailwind CSS في Flex الـ

9- Flex in Tailwind CSS (1) [Arabic] | (1) Tailwind CSS في Flex الـ

Arabic:
1. يوفر Tailwind CSS فئات مرنة للتحكم في تنسيق العناصر باستخدام Flexbox بسهولة وفعالية.
2. يمكنك استخدام الفئة `flex` لتحويل العنصر إلى حاوية flex، مما يسهل ترتيب العناصر الداخلية بشكل مرن.
3. الفئة `flex-row` تجعل العناصر الداخلية تتراص في صف أفقي، بينما الفئة `flex-col` تجعلها تتراص في عمود رأسي.
4. استخدم الفئة `justify-center` لمركزية العناصر الداخلية أفقياً داخل حاوية flex.
5. الفئة `items-center` تتيح لك محاذاة العناصر الداخلية عمودياً في وسط الحاوية.
6. يمكن استخدام الفئة `flex-wrap` لجعل العناصر الداخلية تنتقل إلى السطر التالي عندما لا يكون هناك مساحة كافية في السطر الحالي.
7. الفئة `space-x-4` تضيف مسافة أفقية بمقدار 1rem بين كل عنصرين في صف flex، بينما الفئة `space-y-4` تضيف مسافة عمودية بنفس المقدار بين كل عنصرين في عمود flex.

English:
1. Tailwind CSS provides flexible classes for controlling element layout using Flexbox easily and effectively.
2. You can use the `flex` class to turn an element into a flex container, making it easy to arrange its child elements flexibly.
3. The `flex-row` class makes the inner elements align in a horizontal row, while the `flex-col` class makes them align in a vertical column.
4. Use the `justify-center` class to center the inner elements horizontally within the flex container.
5. The `items-center` class allows you to vertically align the inner elements in the center of the container.
6. The `flex-wrap` class can be used to wrap the inner elements to the next line when there isn’t enough space in the current line.
7. The `space-x-4` class adds a horizontal space of 1rem between each pair of elements in a flex row, while the `space-y-4` class adds the same vertical space between each pair of elements in a flex column.

Видео 9- Flex in Tailwind CSS (1) [Arabic] | (1) Tailwind CSS في Flex الـ канала Ghaiath Al trabulsi غياث الطرابلسي