режим стандартов высоты css - PullRequest
0 голосов
/ 04 января 2011

Привет и приятно познакомиться. Я хотел бы спросить следующее.

<body>
    <div style="border:1px solid #ff0000">
        <pre>dfssdgfdsgsd sdgsdg
        sgdsdsgsdg
ггг

Можно ли заставить #secondDiv занять 100% (по высоте) оставшегося вертикального пространства? Я не хочу использовать min-height (не работает в ie) или javascript.
Полный HTML http://paste2.org/p/1177197
Спасибо.
PS: Я знаю, что существует много связанных вопросов, поэтому я извиняюсь за дубликат.

Ответы [ 2 ]

0 голосов
/ 04 января 2011

Если вы можете использовать фиксированную высоту для верхнего div, то легко обойти второй div с помощью абсолютного позиционирования.

CSS

html,body{
  margin:0;
  padding:0;
  width:100%;
  height:100%;
}
#head{
  border:1px solid #ff0000;
  height:50px;
}
#content{
  position:absolute;
  top:50px;
  bottom:0;
  width:100%;

  border:1px solid #ff0;
}

HTML

<code><body>
    <div id="head">
        <pre>dfssdgfdsgsd sdgsdg
        sgdsdsgsdg
ggg

Демо: http://www.jsfiddle.net/RVTpT/

0 голосов
/ 04 января 2011

добавьте #secondDiv { height:100%; } к вашему CSS.

Я полагаю, что для того, чтобы это работало в IE, необходимо также установить

html, body { height:100%; }

...