CSS Div автоматическое увеличение высоты

Question

CSS Div автоматическое увеличение высоты

0

Я хочу разместить три divs один ниже другого. т.е. в основном хотят избежать прокрутки страниц, за исключением среднего div.

http://jsfiddle.net/2ay2p/

<div id="one">

</div>
<div id="two">

</div>
<div id="three">

</div>

#one{
    width:100%;
    height: 10%;
}
#two{
    width:100%;
    height: 80%;
}
#three{
    width:100%;
    height: 10%;
}

Я хочу, чтобы центр div занимал полную высоту, даже если высота контента меньше 80%. Если высота содержимого> 80%; Я хочу, чтобы появлялась полоса прокрутки.

Как я могу достичь этого с помощью чистого css?

Aditya Kappagantula 14 март 2014, в 06:24

Источник

0

Можете ли вы предоставить более подробную информацию? Как и в случае с примером.
Dhwani 14 март 2014, в 05:19
0

80% меньше нормального 100%. Вы говорите о px ?
Amit Joki 14 март 2014, в 05:20
0

Нет. Я хочу, чтобы высота была в процентах.
Aditya Kappagantula 14 март 2014, в 05:21

Показать ещё 1 комментарий

Теги:

html

css

3 ответа

0

Вам нужно установить overflow:auto для Scoll Bar и посмотреть демо ниже второго div, взяв полную высоту

ДЕМО ЗДЕСЬ

ДЕМО С ScrollBar

Harshit Tailor 14 март 2014, в 03:06

0

Я не хотел жестко задавать высоту для любого div.
Aditya Kappagantula 14 март 2014, в 05:24

-1

Использовать маржу: 0 авто. Он отображает div в центре

Jalpa 14 март 2014, в 03:18

0

Вопрос в том, чтобы избежать скроллера. Не отображать центр.
Aditya Kappagantula 14 март 2014, в 05:20
0

ОП просит разные
Amit Joki 14 март 2014, в 05:20

Ещё вопросы

Можете ли вы предоставить более подробную информацию? Как и в случае с примером.
80% меньше нормального 100%. Вы говорите о px ?
Нет. Я хочу, чтобы высота была в процентах.
Я не хотел жестко задавать высоту для любого div.
Вопрос в том, чтобы избежать скроллера. Не отображать центр.

Adrian Enriquez · Accepted Answer · 2014-03-14T02-36-00.000Z

Вы очень близки, вам просто нужно добавить высоту и ширину для тела и html, чтобы сделать эту работу. Попробуйте демонстрационную версию ниже.

DEMO

CSS

html, body {
    height:100%;
    width:100%;
    margin:0;
    padding:0;
}

также добавить overflow:auto; на вашем среднем div, чтобы включить прокрутку. Проверьте это демо для длинного текста.

Выглядит хорошо, позвольте мне попробовать и вернуться! Спасибо :)