Как зафиксировать объект справа, что бы он был независим от размеров экрана?

Question

[Cheizer]

Друзья, нужна помощь, вообще не понимаю как сделать простейшую задачу.

Есть див, в нем фоном рисунок лежит, как его зафиксировать справа, что бы он при изменении горизонтального размера экрана оставался на месте, фиксированным. attachmet fixed не вариант.

В данном примере фон большой круг.
Вот живой пример:
https://codepen.io/Cheizer/pen/qGBoew

измените размер по горизонтали, увидите что фон гуляет то влево то вправо. А нужно зафиксировать его под рисунком, и вот как это сделать не пойму, фон большой могу постелить его только на родителя или абсолютный блок.
Подскажите пожалуйста, очень нужна светлая идея.

Comments

[Rustam Bainazarov]

1. Сделать фон сразу с этим ноутбуком в круге

2. Ноутбук в круге сделать тоже фоном через запятую.

3. Круг сделать псевдоэлементом, относительно ноутбука, а круги-волны сделать с помощью box-shadow. Можно радиальным градиентом.

Лучше 3-й вариант.

UPDATE. Про box-shadow сказал, не подумав нормально. Я не знаю, как с box-shadow так сделать (прозрачные круги с тонкой границей и отступом от элемента).

[Cheizer]

Рустам Байназаров, спасибо, попробую через AFTER, по другому пока никак, ноутбук рисунок будет разным рисунком который юзер будет загружать, box-shadow кстати тоже попробую, но думаю слишком сложно сделать так как рисунок. Слишком много кругов.

[Lord_Dantes]

Роман Кузнецов, на изи

[Rustam Bainazarov]

Роман Кузнецов, достаточно просто сделать с помощью box-shadow на самом деле.

UPDATE. Про box-shadow сказал, не подумав нормально. Я не знаю, как с box-shadow так сделать (прозрачные круги с тонкой границей и отступом от элемента).

[Cheizer]

Рустам Байназаров, это очень сложно, это сколько раз нужно прописать стиль box-shadow что бы повторить такое количество кругов.

[Rustam Bainazarov]

Роман Кузнецов, можно сделать ход конём для прикола, LOL:

[Cheizer]

Рустам Байназаров, ох нифига себе подход, возьму на вооружение! Спасибо!

[Cheizer]

Рустам Байназаров, не могу вас отметить решением, вы прокомментировали как ответ на мое сообщение, кнопки нет, скопируйте как отдельный комментарий. Выберу ваш ответ как решение.

[Rustam Bainazarov]

Роман Кузнецов, хорошо :))

Answer 1

[Rustam Bainazarov]

Можно для полного прикола вот так сделать:

Answer 2

[lukoie]

Дык на :after вешайте фон

Comments

[Cheizer]

Спасибо, пробую, совсем забыл про AFTER