Требуется сделать универсальный элемент – плавающий баннер, на работу которого не будет влиять остальная верстка страницы.
1. элемент должен быть адаптивным, занимая всю ширину страницы;
2. внутренняя картинка должна располагаться точно по центру блока;
3. цвет окружающего фона должен устанавливаться явно, в самом блоке;
4. в верхнем левом углу баннера (см. дизайн, рис 1) должна быть иконка-логотип, по нажатию на которую выезжает блок дополнительной информации с кнопкой "ПЕРЕЙТИ" и текстом и крупным лого.
4.1. в верхнем правом блока дополнительной информации должна быть кнопка-иконка "закрыть», закрывающая блок с доп. информацией
5. Все кнопки должны быть сделаны через css (кроме логотипов – это картинки)
6. Плавающий баннер должен работать под всеми современными мобильными и десктопными браузерами (Chrome, Safari, Firefox, IE), никак не изменяя поведение окружающих баннер элементов страницы.
7. Должна быть возможность задать размер всего баннера по высоте (целый экран или в процентах от высоты экрана)
Пример можно увидеть на странице
с мобильного.