Фиксированное позиционирование 3

Создайте веб-страницу, как показано на рис. 1, в которой кнопка зафиксирована снизу на одном месте и не сдвигается с прокруткой документа.

Рис. 1

Файлы
<!DOCTYPE html> <html lang="ru"> <head> <meta charset="utf-8"> <title>Фиксированное позиционирование</title> <style> .fab { position: fixed; left: 50%; bottom: 20px; transform: translateX(-50%); background-color: #0288d1; padding: 10px; border: 0; border-radius: 50%; box-shadow: 0 5px 4px rgb(0 0 0 / 50%); } .fab > img { display: block; } </style> </head> <body> <button class="fab"> <img src="image/button-plus-white.svg" alt="Добавить" width="30"> </button> </body> </html>
Эта самостоятельная связана со следующим уроком: Элементы вне потока