Изображение рамки поверх страницы

ЕСТЬ РЕШЕНИЕ ЗАКРЫТО InstantCMS 2.X

Предыдущая
1
2
3
Показаны 31-33 из 33

#31 22 сентября 2017 в 19:59

вы вставили див который на моем первом примере должен был выполнять роль основного дива. закрывающий тег </div> для него вы удалили а то что выделено красным осталось.

и лучше поместить внутрь layout поскольку position:absolute идет относительно его
Нил™

Ни так ни этак! Верх регулируется, а низ устанавливается на уровне страницы, а должен быть ниже, перекрывая фон.
При установке в layout картинки сползают в границы страницы… Замкнутый круг.
А жаль неплохо получалось.
Сейчас оставил 2 элемента вверху. Что делать с низом не знаю.
Понимаю, что все устали от этого… Спасибо за помощь!
В любом случае для меня хороший практикум.

По рефке 10% скидка на мощный и гибкий хостинг на NVMе дисках! Дешевые домены здесь! Чат-боты для любых соцсетей

#32 27 октября 2017 в 02:44

Вот я опять со своим вопросом! Садик категорически против менять что либо в дизайне… им очень нравится!
Но встала проблема адаптивности двух картинок:

<!-- верхняя часть рамки--->
<div style="width:1280px; height:85px; opacity:0.9; background: url(images/ramka/top_head1060.png) repeat-x; position:absolute; top:0; left:50%; margin-left:-645px; z-index:1000;"></div>
 
<!-- углы лево верх, право верх, лево низ, право низ --->
<div style="width:260px; height:305px;  opacity:0.9; background: url(images/ramka/left_head260x430.png) no-repeat; position:absolute; left:50%; margin-left:-645px; top:0; z-index:1001;"></div>

Из ранее заявленных оставил только две и надо их сделать адаптивными. Пробовал сам, но е получилось!
Помогите картинки сделать адаптивными.

По рефке 10% скидка на мощный и гибкий хостинг на NVMе дисках! Дешевые домены здесь! Чат-боты для любых соцсетей

#33 29 октября 2017 в 00:30

Благодаря помощи замечательного человека Val наконец подошел к окончательному решению проблемы!
Задача адаптивно наложить две картинки поверх страницы выглядит так

 
body:before {
    content: "";
    display: block;
    position: fixed;
    width: 100%;
    height: 100%;
    max-width: 0 auto;
    max-height: 0 auto;
    opacity: 0.9;
    background: url(../images/ramka/top_head1060.png);
    top: 0;
    left: 50%;
    margin-left: -645px;
    background-size: containt;
    background-repeat: no-repeat;
    z-index: 100;
    pointer-events: none;
}
body:after {
    content: "";
    display: block;
    position: fixed;
    width: 100%;
    height: 100%;
    max-width: 260px;
    max-height: 305;
    opacity: 0.9;
    background: url(../images/ramka/left_head260x430.png);
    top: 0;
    left: 50%;
    margin-left: -645px;
    background-size: contain;
    background-repeat: no-repeat;
    z-index: 100;
    pointer-events: none;
}

Так же большое спасибо Нилу и другим принявшим непосредственное участие в решении проблемы.

По рефке 10% скидка на мощный и гибкий хостинг на NVMе дисках! Дешевые домены здесь! Чат-боты для любых соцсетей

Предыдущая
1
2
3
Показаны 31-33 из 33

Как изменить стиль номеров в с

Загрузка изображений(урезает ф

Изображение рамки поверх страницы

Похожие темы

Неизвестный h4 поверх всех тегов

Помогите разобраться с размером изображения в списке

Тип контента, комментарии, изображения

OWL-слайдер набора изображений отображение

[ЕСТЬ РЕШЕНИЕ] Формат WEBP в наборе изображений

[ЕСТЬ РЕШЕНИЕ] Как изменить размер изображения при загрузке

InstantCMS Team

О проекте

Поддержка

Дополнения