Рекомендуемые сообщения

Santelgsm    1

Доброго дня , подскажите как с помощью css "раздвинуть" фон модуля на ширину экрана 

 

Screenshot_1.jpg

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
zlatoff    43

Это не в css, а в шаблоне модуля. Алгоритм такой:

1) выходите их контейнера (class container), на вскидку 1 или 2 закрывающих дива (</div>),

2) создаете новый блок div, он растекается по всей ширине дисплея, присваиваете ему класс с фоном/бэкграундом,

3) в нем создаете свой контейнер,

4) в него заворачиваете модуль,

5) закрываете контейнер модуля,

6) закрываете блок с вашим фоном,

7) снова возвращаете в магазин закрытый контейнер (что бы нижестоящий контент не поплыл) с 1 или 2 div'ами.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
jaffagold    158

Самое простое решение- модуль Free Positions.

Он создает две широкоэкранные позиции под Главным меню и над Футером.

И нужный блок выводите в одну из этих позиций.

 

Хотя, вышеприведенное решение можно попробовать. Причем, прямо в инспекторе кода.

Но там сложнее конструкция

div.container

  div.row

    div#content

      код модуля, который как правило идет без обертки, а сразу с H3 начинается

Суть правок кода модуля:

в самом начале модуля надо добавить </div></div></div> (закрываем три ранее открытых блока.)

после кода модуля снова открыть блоки

div.container

  div.row

    div#content-1 ( добавить-1) ( снова открываем блоки, чтобы не страдал контент внизу страницы)

 

и уже что-то будет видно, но это еще не все....

Мне кажется важным в данном случае добавить модулю две обертки

сначала class="container-fluid my-module" для стилизации.

а потом class="container" для возврата контента в рамки контейнера..

а потом еще разобраться с высотой блока  div#content

а потом еще что-то вылезет.

 

Мне кажется, проще добавить две широкоэкранные позиции модулем. 

 

Изменено пользователем jaffagold

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
Santelgsm    1
2 часа назад, jaffagold сказал:

Самое простое решение- модуль Free Positions.

Он создает две широкоэкранные позиции под Главным меню и над Футером.

И нужный блок выводите в одну из этих позиций.

 

Мне кажется, проще добавить две широкоэкранные позиции модулем. 

 

К сожалению , данный модуль под 2.3  у меня 2.1 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
Santelgsm    1
3 часа назад, zlatoff сказал:

Это не в css, а в шаблоне модуля. Алгоритм такой:

1) выходите их контейнера (class container), на вскидку 1 или 2 закрывающих дива (</div>),

2) создаете новый блок div, он растекается по всей ширине дисплея, присваиваете ему класс с фоном/бэкграундом,

3) в нем создаете свой контейнер,

4) в него заворачиваете модуль,

5) закрываете контейнер модуля,

6) закрываете блок с вашим фоном,

7) снова возвращаете в магазин закрытый контейнер (что бы нижестоящий контент не поплыл) с 1 или 2 div'ами.

Спасибо , вряд ли получится сделать самостоятельно . Но попытаюсь :)

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
jaffagold    158

Дайте ссылку на сайт, можно в личные сообщения

 

Смотрите, вот же для 2.1 от того же автора

Вот такой вид можно получить( на фон блоков смотрите)

Спойлер

spu-ea68c8-ogi2-3cwn3bmfojjlb56e.jpg.666

 

Изменено пользователем jaffagold

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
Santelgsm    1
12 часов назад, jaffagold сказал:

Дайте ссылку на сайт, можно в личные сообщения

 

Смотрите, вот же для 2.1 от того же автора

Вот такой вид можно получить( на фон блоков смотрите)

  Показать контент

spu-ea68c8-ogi2-3cwn3bmfojjlb56e.jpg.666

 

Спасибо ,.Это то , что нужно :)

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
Santelgsm    1
В 02.02.2018 в 10:48, zlatoff сказал:

Это не в css, а в шаблоне модуля. Алгоритм такой:

1) выходите их контейнера (class container), на вскидку 1 или 2 закрывающих дива (</div>),

2) создаете новый блок div, он растекается по всей ширине дисплея, присваиваете ему класс с фоном/бэкграундом,

3) в нем создаете свой контейнер,

4) в него заворачиваете модуль,

5) закрываете контейнер модуля,

6) закрываете блок с вашим фоном,

7) снова возвращаете в магазин закрытый контейнер (что бы нижестоящий контент не поплыл) с 1 или 2 div'ами.

c css знаком неделю , по вашему методу сделал - заработало 

сделал так :

</div>
</div>
</div>
</div>
<div id="fon10">
        <div class="container-fluid">
            <div class="row">
              тут разместил модуль 

так правильно ?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти


  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу