высота div: 100%, пока содержание не станет выше, чем высота браузера? - PullRequest
Новая
       2

высота div: 100%, пока содержание не станет выше, чем высота браузера?

0 голосов
/ 26 июля 2010

Есть ли способ указать элементу div заполнить 100% доступной высоты страницы, пока он не получит достаточно содержимого, чтобы потребовать полосу прокрутки?: 

// browser height: 600px:

<div>
    // empty, so just be 600px tall.
</div>

....

// when it gets content and gets taller than
// the page, don't need to auto-height itself
// anymore.
<div>
  <ul>
    <li></li>
    <li></li>
    ...
  </ul>
</div>

существует ли какой-либо стиль, который может сделатьэто происходит, или это нужно сделать с помощью JavaScript?

Спасибо

Ответы [ 4 ]

2 голосов
/ 26 июля 2010

Посмотрите на минимальную высоту.Не поддерживается в старых версиях IE, но должен делать то, что вы хотите.http://www.w3schools.com/CSS/pr_dim_min-height.asp

1 голос
/ 26 июля 2010

Это простой способ сделать то, что вы ищете: 

<!DOCTYPE HTML>
<html>
<head>
   <meta http-equiv="Content-type" content="text/html; charset=utf-8">
   <title>Demo</title>
   <style type="text/css" media="screen">
      #content { position: absolute; top: 0; bottom: 0; right: 0; left: 0; overflow: auto; }
   </style>
</head>
<body>
   <div id="content">
      <p>Embed all your content here.</p>
   </div>
</body>
</html>

В качестве альтернативы, если вы хотите поддерживать старые браузеры, вы можете сделать это вместо этого: 

#content { position: absolute; top: 0; left: 0; height: 100%; overflow: auto; width: 100%; }
0 голосов
/ 26 июля 2010

в вашем CSS, у вас есть html, тело установлено на {height: 100%}

0 голосов
/ 26 июля 2010 
<!doctype html> 
<html> 
    <head> 
    <style> 
        * {
        margin:0;
        padding:0;
        }

        html, body {
        height:100%;
        }

        div#page {
        background:#333;
        min-height:100%;
        text-align:center;
        }
    </style> 
    </head> 
    <body> 
    <div id="page"></div> 
    </body> 
</html>

Высота подачи: 100% к IE6, если вы заботитесь об этом в условном выражении.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...