خمسة أسئلة عن هذه الوحدة. أجب عنها كلها، ثم شاهد نتيجتك وسبب صحة كل إجابة أو خطئها.
السؤال 1 من 5
صفحة بـ display: flex فيها شريط جانبي بعرض 16rem وmain له flex: 1. جدول بيانات عريض داخل main يدفع الصفحة إلى التمرير الأفقي. ما الإصلاح الموجَّه؟
display: flex
main
flex: 1
min-width: 0
overflow-x: auto
flex-shrink: 1
overflow: hidden
body
flex: auto
السؤال 2 من 5
شبكة تستخدم grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)) بلا فجوة في حاوية عرضها 500px. كم عمودًا فيها، وما عرض كلٍّ منها؟
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr))
السؤال 3 من 5
نموذج تسجيل المتحدّثين فيه ثلاثة fieldsets، في كلٍّ منها أزواج من التسميات والحقول. يجب أن تشكّل التسميات عمودًا واحدًا متساوي العرض عبر كل الـ fieldsets. والنموذج شبكة من عمودين. ماذا تضيف إلى كل fieldset؟
display: grid; grid-template-columns: max-content 1fr;
display: contents;
display: grid; grid-column: span 2; grid-template-columns: subgrid;
width: 100%;
السؤال 4 من 5
بطاقة جلسة في شريط جانبي عرضه 300px. يتبدّل تخطيطها بـ @container (width > 400px)، والشريط الجانبي هو حاوية الحجم. عرض نافذة المتصفّح 1400px. أيّ تخطيط تحصل عليه البطاقة؟
@container (width > 400px)
السؤال 5 من 5
ما العرض الذي تُنتجه width: clamp(280px, 50%, 600px) داخل عنصر أب عرضه 400px؟
width: clamp(280px, 50%, 600px)
5 أسئلة بلا إجابة