--- id: 587d781e367417b2b2512aca title: Move a Relatively Positioned Element with CSS Offsets challengeType: 0 videoUrl: '' localeTitle: انقل عنصر تم تحديد موضعه نسبيًا باستخدام إزاحات CSS --- ## Description
تخبر إزاحات CSS top أو bottom ، وإلى left أو right المتصفح عن مدى إزاحة عنصر متعلق بالمكان الذي سيجلس فيه في التدفق العادي للمستند. يتم تعويض عنصر بعيدًا عن نقطة معينة ، والتي تحرك العنصر بعيدًا عن الجانب المشار إليه (على نحو فعال ، في الاتجاه المعاكس). كما رأيت في التحدي الأخير ، فإن استخدام الإزاحة الأعلى نقل h2 الأسفل. وبالمثل ، فإن استخدام إزاحة اليسار يؤدي إلى تحريك عنصر إلى اليمين.

تعليمات

استخدم إزاحات CSS لنقل وحدات بكسل h2 15 إلى اليمين و 10 بكسل لأعلى.

اختبارات

 tests: - text: 'Your code should use a CSS offset to relatively position the <code>h2</code> 10px upwards. In other words, move it 10px away from the <code>bottom</code> of where it normally sits.' testString: 'assert($("h2").css("bottom") == "10px", "Your code should use a CSS offset to relatively position the <code>h2</code> 10px upwards. In other words, move it 10px away from the <code>bottom</code> of where it normally sits.");' - text: 'Your code should use a CSS offset to relatively position the <code>h2</code> 15px towards the right. In other words, move it 15px away from the <code>left</code> of where it normally sits.' testString: 'assert($("h2").css("left") == "15px", "Your code should use a CSS offset to relatively position the <code>h2</code> 15px towards the right. In other words, move it 15px away from the <code>left</code> of where it normally sits.");' 

بذور التحدي

 <head> <style> h2 { position: relative; } </style> </head> <body> <h1>On Being Well-Positioned</h1> <h2>Move me!</h2> <p>I still think the h2 is where it normally sits.</p> </body> 

حل

 // solution required 
## Instructions
استخدم إزاحات CSS لنقل وحدات بكسل h2 15 إلى اليمين و 10 بكسل لأعلى.
## Tests
```yml tests: - text: يجب أن تستخدم شفرتك إزاحة CSS لوضع h2 10px صعودًا نسبيًا. بعبارة أخرى ، حركه بمقدار 10 بكسل بعيدًا عن bottom المكان الذي يجلس فيه عادةً. testString: 'assert($("h2").css("bottom") == "10px", "Your code should use a CSS offset to relatively position the h2 10px upwards. In other words, move it 10px away from the bottom of where it normally sits.");' - text: يجب أن تستخدم شفرتك تخالف CSS لوضع h2 15px نسبيًا نحو اليمين. بعبارة أخرى ، حركه بمقدار 15 بكسل بعيدًا عن left المكان الذي يجلس فيه عادةً. testString: 'assert($("h2").css("left") == "15px", "Your code should use a CSS offset to relatively position the h2 15px towards the right. In other words, move it 15px away from the left of where it normally sits.");' ```
## Challenge Seed
```html

On Being Well-Positioned

Move me!

I still think the h2 is where it normally sits.

```
## Solution
```js // solution required ```