---
id: 587d781e367417b2b2512acb
title: Lock an Element to its Parent with Absolute Positioning
challengeType: 0
videoUrl: ''
localeTitle: قفل عنصر إلى الوالد مع وضع مطلق
---
## Description
الخيار التالي لخاصية position CSS absolute ، والذي يقوم بتثبيت العنصر في مكانه بالنسبة للحاوية الرئيسية. على عكس الوضع relative ، يؤدي هذا إلى إزالة العنصر من التدفق العادي للمستند ، لذلك فإن العناصر المحيطة به تتجاهله. يتم استخدام خصائص إزاحة CSS (أعلى أو أسفل وإلى اليسار أو اليمين) لضبط الموضع. واحد فارق بسيط مع تحديد المواقع المطلق هو أنه سيتم تأمين بالنسبة إلى أقرب السلف المتوضعة . إذا نسيت إضافة قاعدة الموضع إلى العنصر الرئيسي ، (عادة ما يتم ذلك باستخدام position: relative; ) ، سيظل المتصفح يبحث عن السلسلة وينتهي افتراضيًا بعلامة body.
## Instructions
قفل عنصر #searchbar في أعلى يمين section الأصل من خلال إعلان position أنه absolute . إعطائها top و right إزاحة من 50 بكسل لكل منهما.
## Tests
```yml
tests:
- text: 'و #searchbar يجب أن يكون العنصر في position المقرر أن absolute .'
testString: 'assert($("#searchbar").css("position") == "absolute", "The #searchbar element should have a position set to absolute.");'
- text: 'يجب أن تستخدم شفرتك top إزاحة CSS بمقدار 50 بكسل في عنصر #searchbar .'
testString: 'assert($("#searchbar").css("top") == "50px", "Your code should use the top CSS offset of 50 pixels on the #searchbar element.");'
- text: 'يجب أن تستخدم شفرتك إزاحة CSS right من 50 بكسل في عنصر #searchbar .'
testString: 'assert($("#searchbar").css("right") == "50px", "Your code should use the right CSS offset of 50 pixels on the #searchbar element.");'
```
## Challenge Seed
## Solution
```js
// solution required
```