CSS — Flexbox

مقدمة

Flexbox يرتّب العناصر أفقياً/عمودياً مع تحكم بالمحاذاة.

ماذا ستتعلم؟

• display:flex
• justify-content
• align-items
• gap
• flex:1

الصياغة

.wrap{ display:flex; }

مثال

.wrap{ display:flex; gap:12px; }
.box{ flex:1; padding:16px; border:1px solid #e5e7eb; border-radius:14px; text-align:center; }

ملاحظات

• استخدم gap للمسافات.
• flex:1 لتقسيم المساحة.

  جرّب بنفسك: افتح Playground: /ar/playground/html