Вивчайте Завдання: Застосування Відносного Позиціонування

Примітка

Кожне завдання в цьому курсі містить зразок коду, що складається з файлів index.html та index.css. Оскільки курс зосереджений на вивченні CSS, рекомендується виконувати завдання у файлі index.css. Після завершення завдання натисніть кнопку "Run Code", щоб переглянути сторінку в реальному часі та переконатися, що завдання виконано правильно.

Крім того, для кожного завдання доступні кнопки "Hint" та "Solution". Натискання кнопки "Hint" відобразить підказки, що стосуються поточного завдання, а кнопка "Solution" покаже зразок коду з правильним застосуванням CSS.

Завдання

Додати позиціонування relative до другого елемента з класом item.
Перемістити елемент на 30px вниз і на 50px вліво.

index.html

index.css

Переміщення вниз шляхом встановлення додатного значення для властивості top.
Переміщення вліво шляхом встановлення від’ємного значення для властивості left.

index.html

index.css

Все було зрозуміло?

Дякуємо за ваш відгук!

Секція 2. Розділ 3

Запитати АІ

Запитайте про що завгодно або спробуйте одне із запропонованих запитань, щоб почати наш чат

Suggested prompts:

How do I select the second element with the `item` class in CSS?

Can you explain how `position: relative` works in this context?

What values should I use for the `top` and `left` properties to achieve the required movement?

Awesome!

Completion rate improved to 2.04

Свайпніть щоб показати меню

Примітка

Кожне завдання в цьому курсі містить зразок коду, що складається з файлів index.html та index.css. Оскільки курс зосереджений на вивченні CSS, рекомендується виконувати завдання у файлі index.css. Після завершення завдання натисніть кнопку "Run Code", щоб переглянути сторінку в реальному часі та переконатися, що завдання виконано правильно.

Крім того, для кожного завдання доступні кнопки "Hint" та "Solution". Натискання кнопки "Hint" відобразить підказки, що стосуються поточного завдання, а кнопка "Solution" покаже зразок коду з правильним застосуванням CSS.

Завдання

Додати позиціонування relative до другого елемента з класом item.
Перемістити елемент на 30px вниз і на 50px вліво.

index.html

index.css

Переміщення вниз шляхом встановлення додатного значення для властивості top.
Переміщення вліво шляхом встановлення від’ємного значення для властивості left.

index.html

index.css

Все було зрозуміло?

Дякуємо за ваш відгук!

Секція 2. Розділ 3