Как правильно вставить блок на всю ширину экрана в container?

Question

[Егор Огурцов]

Есть некая страница с парой текстовых блоков выводимых внутри .container (bootstrap3).
Задача - не меняя структуры верстки вставить между ними картинку на всю ширину экрана.

Первое и очевидное - position: absolute; width: 100%; float: left; и вычислять высоту с помощью js для отступа.
Может есть еще какие решения?

Comments

[Егор Огурцов]

Artem Verbat: контейнер уже есть, это будет плагин, вставляемый в тексте

Answer 1

[Руслан Шадура]

Всмысле "между ними"? на заднем фоне?

Comments

[Егор Огурцов]

как-то так должно быть (направляющие это граница .container)
jtem.ru/screenshots/Bez_imeni-1__100_RGB8__2016-05...

Answer 2

[Максим Тимофеев]

С помощью псевдоклассов css, например

.vash_class:before {content:" "; possition:absolute; top:0; left:0; bottom:0; right:0; background:url('путь к картинке') no-repeat 50% 50%; background-size:cover;}

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

Comments

[Егор Огурцов]

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

[Максим Тимофеев]

Егор Огурцов: А ка же Вы ждали правильного ответа? Что еще не описали? Тогда создаете заранее контейнер и в него слайдер вставляет код. В чем проблема?

Answer 3

[Сергей Тутуков]

codepen.io/STutukov/pen/MyRJwm
Либо с помощью js закрывать .container
вставлять блок с картинкой

Comments

[Егор Огурцов]

видимо я зря написал о картинке (думал так нагляднее будет). там будет блок со слайдером, т.е. на выход за границы нельзя закрыть глаза.

[Сергей Тутуков]

codepen.io/STutukov/pen/MyRJwm
Только учитывай что vw - это вьюпорт
то есть vw без скрола = vw со скролом

[Денис Князев]

sftutukov: а если просто для класса .images добавить отрицательные отступы ?
.images{
position: relative;
margin-left: calc(-50vw + 50%);
margin-right: calc(-50vw + 50%);
}

[Сергей Тутуков]

Либо можно задавать ширину блока в px, но тут надо js
$("html").width();

Но я бы лучше сделал как говорил ранее, закрывал бы .container

[Сергей Тутуков]

Денис Князев:
Можно