Установите блок div на 100% тела

Я пытаюсь получить средний блок (с серым фоном), чтобы растянуться по сторонам браузера. Я был в состоянии получить это произойдет со следующим кодом:Установите блок div на 100% тела

#aboutBlock { 
    background: #f2f2f1; 
    position:absolute; 
    left:0; 
    width: 100%; 
}

Проблема теперь DIV, который следует показывает вверх под этим, когда он должен появиться сразу после этого дел.

источник

2015-02-12 user1110562

Я бы структурировал html по-разному, чтобы достичь этого – Huangism

Я согласен с @Huangism, но если вы хотите быстрый и грязный подход ... 'width: 100vw', однако, пожалуйста, рассмотрите структурные изменения в вашем html. –

Если вы хотите провести реструктуризацию, я предлагаю [структуру, подобную этому] (http://jsfiddle.net/9y0m34h2/). – showdev

Вы имеете этот элемент внутри элемента с шириной 950px:

.block1 { 
    width: 950px; 
    margin: 0 auto; 
    padding: 0 0 48px 0; 
}

Вам нужно установить .block1 ширину до 100%, а также элементы над ним весь путь до и включая <body>, и взять position:absolute с #aboutBlock. Затем вам нужно будет установить ширину для элементов шириной 950 пикселей.

Но, как сказал Хуангизм, я бы, вероятно, структурировал html по-разному.

источник

2015-02-12 19:39:48 Ted

Когда вы используете position: absolute, элемент вынимается из макета документа (другие вещи на странице игнорируют его наличие и просто идут за ним/поверх него). Похоже, ваша проблема в том, что ваш div «block1» установлен только на определенную ширину, а ваш «aboutBlock» находится внутри этого «block1». Чтобы исправить это, вам нужно либо сделать «block1» полной шириной страницы, либо сделать все ваши другие секции определенной шириной (выглядит как 950px) и центрированной (с margin: 0 auto) или сделать следующее:

.aboutBlock { 
    float: left; 
    width: 100%; 
} 
.block1 { 
    overflow: visible; 
}

И добавить:

<div style="clear: both; height: 0">&nbsp;</div>

Под "aboutBlock".

источник

2015-02-12 19:42:01

Установите блок div на 100% тела

ответ

Смежные вопросы