Фон на ширину экрана

[Santelgsm]

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

 

[zlatoff]

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

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

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

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

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

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

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

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

[jaffagold]

Самое простое решение- модуль 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

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

 

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

 

Змінено 2 лютого 2018 користувачем jaffagold

[Santelgsm]

2 часа назад, jaffagold сказал:

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

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

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

 

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

 

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

[Santelgsm]

3 часа назад, zlatoff сказал:

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

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

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

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

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

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

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

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

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

[jaffagold]

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

 

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

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

Спойлер

 

Змінено 2 лютого 2018 користувачем jaffagold

[Santelgsm]

12 часов назад, jaffagold сказал:

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

 

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

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

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

 

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

[Santelgsm]

В 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">
              тут разместил модуль 

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