47. مخطط التموضع: Fixed (مقيد بمنفذ العرض)

position: fixed يزيل العنصر من التدفق الطبيعي، تماماً مثل absolute. ومع ذلك، فإن نقطته المرجعية هي دائماً منفذ العرض (نافذة المتصفح)، مما يعني أنه يظل في نفس المكان حتى عند تمرير الصفحة.

كيف يعمل التموضع الثابت

1. خارج التدفق: تنهار مساحة العنصر الأصلية.
2. ثابت في منفذ العرض: يتم وضع العنصر بالنسبة لنافذة المتصفح نفسها.
3. تطبق الإزاحات: top و right و bottom و left تضع العنصر بالنسبة لحواف منفذ العرض.

css .navbar-fixed { position: fixed; top: 0; /* يظل ثابتاً في الحافة العلوية للمتصفح / left: 0; width: 100%; / يمتد على كامل عرض المتصفح */ background-color: #333; color: white; padding: 10px 0; }

حالات الاستخدام الشائعة

• أشرطة التنقل الثابتة: العناوين التي تظل مرئية أثناء التمرير.
• الأدوات العائمة: أزرار الدردشة الحية، أو لافتات الموافقة على ملفات تعريف الارتباط، أو سلال التسوق اللاصقة.

ملاحظة: يمكن أن تكون العناصر الثابتة مشكلة على الأجهزة المحمولة، خاصة عندما تظهر لوحة المفاتيح الافتراضية، مما يتطلب أحياناً تعديلات دقيقة في استعلامات الوسائط (media queries).