CSS, как сделать высоту 100% в этом случае

Итак, у меня есть эта конструкция как шаблон, она отлично работает с полным содержимым на странице, а вилка не подходит, если текст или изображения не заполняют всю высоту, а затем столбцы и содержимое div вырезаны, если Я окрашиваю их поля. index.htmlCSS, как сделать высоту 100% в этом случае

<!DOCTYPE html> 
    <html> 
    <head> 
    <link rel="stylesheet" href="css/grad.css"> 
    <link rel="stylesheet" href="css/style.css"> 
    <link rel="stylesheet" href="css/menu.css"> 
    <style type="text/css"> 
    </style> 
    </head> 
    <body> 
    <div id="header"> 
     <div align="center"><img src="img/tsu._e.png" border="0" align="middle"></div> 
    </div> 
    <div id="gradient"></div> 
    <div id="content"> 
     <div id="content1"> 
      <div id="content2"> 
       <div id="content3"> 
        <div id="center"> 

        </div> 
       </div> 
      <div id="left"></div> 
     </div> 
    </div> 
    <div id="right"></div> 
    </div> 
    <div id="footer"></div> 
    </body> 
    </html>

CSS:

* { margin:0px; padding:0px; } 
html { height:100%; } 
body { min-height:100%; position:relative; min-width:800px; } 
* html body { height:100%; } 
#header { background:#0000FF; height:100px; width:100%; } 
#content { width:100%; padding-bottom:60px; width:expression(document.body.clientWidth > 805 ? "100%" : "805px"); overflow:hidden; } 
#content1 { width:100%; float:left; margin-right:-180px; } 
#content2 { background:#000000; margin-right:180px; } 
#content3 { width:100%; float:right; margin-left:-200px; } 
#left { background:#FFFFFF; width:200px; float:left; } 
#center { background:#FFFF; margin-left:200px; } 
#right { background:#FFFFFF; float:right; width:180px; } 
#min_width { width:800px; } 
#footer { position:absolute; bottom:0px; background:#0000FF; width:100%; height:60px; }

gradien высота 3px

Вопрос: почему ДИВ с id=content DonT заполнения 100% высоты? и как его восстановить в этом случае?

источник

2016-03-16 Nick Nikolaev

возможных указаний: [Работа с CSS 'height' собственностью и процентными значениями] (Http: // StackOverflow .com/a/31728799/3597276) –

Вместо

height:100%;

использование

height:100vh;

источник

2016-03-16 19:42:38 MSH

Пожалуйста, объясните, почему это отвечает на вопрос. То есть, какие изменения вы предлагаете делать? Какой эффект у него есть? –

Кажется, у вас нет 100% в #content

#content { width:100%; padding-bottom:60px; width:expression(document.body.clientWidth > 805 ? "100%" : "805px"); overflow:hidden;

попробовать

#content { height:100%; padding-bottom:60px; width:expression(document.body.clientWidth > 805 ? "100%" : "805px"); overflow:hidden;

и у вас есть все внутренние DIV пустой

источник

2016-03-16 19:13:09 scaisEdge

Это не работа, я проверю уже –

берет из положения относительно вашего тела и дать высоту: 100% к содержанию

источник

2016-03-16 20:02:07 DanyCode

CSS, как сделать высоту 100% в этом случае

ответ

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