تاريخ النشر: 14 يناير 2026
بدءًا من الإصدار 145 من Chrome، تتوفّر السمتان column-wrap وcolumn-height من
المواصفات الخاصة بالمستوى الثاني من تصميم الأعمدة المتعددة.
تتيح لك هذه الخصائص نقل الأعمدة إلى صف جديد في اتجاه الكتلة.
قبل الإصدار 145 من Chrome، إذا تم تقييد ارتفاع الحاوية المتعددة الأعمدة، سيظهر المحتوى الذي لا يتناسب مع المساحة المتاحة كأعمدة فائضة في الاتجاه المضمّن. سيؤدي ذلك إلى إنشاء شريط تمرير أفقي على الويب.
باستخدام السمتَين column-height وcolumn-wrap، يمكنك ضبط ارتفاع لصف الأعمدة وضبط الأعمدة الزائدة لتظهر كصف جديد.
يتيح إنشاء صفوف جديدة من الأعمدة إيجاد حلّ للوضع الحالي الذي يفرض عليك الاختيار بين إجبار المستخدمين على التمرير للأعلى والأسفل لقراءة الأعمدة، أو المخاطرة بظهور شريط تمرير أفقي في الحالات التي يكون فيها مقدار المحتوى غير متوقّع.
ويتيح أيضًا أنماطًا مثل لوحة العرض الدوّارة لاتجاه الحظر، حيث يتم إنشاء أعمدة تملأ ارتفاع إطار العرض المتاح. لقراءة الصف التالي من الأعمدة، انتقِل إلى الشاشة التالية في اتجاه الكتلة.
توفير تجربة قراءة واضحة
في حال توفّر صفوف متعددة من الأعمدة، قد يؤدي ذلك إلى تجربة قراءة غير واضحة، حيث لا يدرك القارئ أنّ هناك صفوفًا متعددة، ويتخطى الفجوة لمواصلة القراءة في أسفل العمود. ويجب مراعاة ذلك عند تصميم واجهة المستخدم. ستمنحك إمكانية إضافة زخارف في فجوة الصفوف القادمة أداة إضافية لإنشاء هذا التمييز المرئي.
ستتوفّر قواعد الصفوف قريبًا
تتضمّن مواصفات المستوى 1 للأعمدة المتعددة خصائص لتصميم عمود-قاعدة؛ يتم وضع هذه القاعدة في الفجوة بين الأعمدة. يتم تضمين خصائص تنسيق قواعد الصفوف في مواصفات CSS Gap Decorations الجديدة، والتي تتوفّر حاليًا في الإصدار التجريبي للمطوّرين. بعد أن يصبح هذا الإعداد ثابتًا، ستتمكّن من إضافة قواعد الصفوف والأعمدة في الشبكة وFlexbox وmulticol.