Как сделать блок на всю ширину страницы внутри блока по середине?

Question

[Ambal89]

Добрый день, подскажите пожалуйста, есть блок, который находится по середине экрана шириной, допустим 1000px. В нём находятся блоки с контентом. Один из блоков контента нужно сделать, чтобы он был не 1000px шириной, а 100% от ширины экрана. Как это можно реализовать? Желательно без absolute.

Comments

[Ярослав Иванов]

Какую-то дичь мутите.

[Сергей delphinpro]

Фигней не страдайте...

<div class=section>
  <div class=container>
    <div class=block>...</div> 
  </div>
</div>

<div class=section section_fullbackground>
  <div class=container>
    <div class=block>...</div> 
  </div>
</div>

<div class=section>
  <div class=container>
    <div class=block>...</div> 
  </div>
</div>

[Ambal89]

Ярослав Иванов: Да, у сайта уже просто есть структура, хотел узнать, можно ли сделать задуманное, не меняя её...

Answer 1

[Николай Чуприк]

width: 100vw;

Comments

[Ambal89]

Спасибо, но вроде это решение не кроссбраузерное?

[Сергей delphinpro]

Николай Чуприк, Вы пробовали? =)

100vw не учитывает полосу прокрутки (наверное это баг) => будет горизонтальная прокрутка.

Если контента мало, то ок - https://jsfiddle.net/q92wa8kk/1/
Если длина страницы больше одного экрана, будет косяк - https://jsfiddle.net/q92wa8kk

[Froggyweb]

Лучше разорвать контейнер. Это абсолютно понятно и предсказуемо. Т.е. делать несколько контейнеров на странице

Answer 2

[Олег]

https://jsfiddle.net/w66hcxkc/1/

Comments

[Ambal89]

Спасибо, но немного не то

[Олег]

Ambal89: изменил https://jsfiddle.net/w66hcxkc/1/