100% высота <div>внутри полностраничного div (верх: 0, низ: 0) - PullRequest
Новая
       0

100% высота <div>внутри полностраничного div (верх: 0, низ: 0)

0 голосов
/ 02 августа 2011

Проблема проста.

Я хочу использовать div полной высоты (#inner) внутри другого div полной высоты (#outer, но с отступами).

Этот код корректно отображается в firefoxи IE8, но не в IE7 и IE6.

Редактировать: В контексте, когда я использую эту структуру, я вынужден установить postition: absoulte для # external.

http://jsfiddle.net/8wVQp/

&#60;&#33;&#68;&#79;&#67;&#84;&#89;&#80;&#69;&#32;&#72;&#84;&#77;&#76;&#32;&#80;&#85;&#66;&#76;&#73;&#67;&#32;&#34;&#45;&#47;&#47;&#87;&#51;&#67;&#47;&#47;&#68;&#84;&#68;&#32;&#72;&#84;&#77;&#76;&#32;&#52;&#46;&#48;&#49;&#47;&#47;&#69;&#78;&#34;&#32;&#34;&#104;&#116;&#116;&#112;&#58;&#47;&#47;&#119;&#119;&#119;&#46;&#119;&#51;&#46;&#111;&#114;&#103;&#47;&#84;&#82;&#47;&#104;&#116;&#109;&#108;&#52;&#47;&#115;&#116;&#114;&#105;&#99;&#116;&#46;&#100;&#116;&#100;&#34;&#62;&#10;&#60;&#104;&#116;&#109;&#108;&#62;&#60;&#98;&#111;&#100;&#121;&#62;&#10;&#60;&#115;&#116;&#121;&#108;&#101;&#62;&#10;&#35;&#111;&#117;&#116;&#101;&#114;&#32;&#123;&#10;&#32;&#112;&#111;&#115;&#105;&#116;&#105;&#111;&#110;&#58;&#32;&#97;&#98;&#115;&#111;&#108;&#117;&#116;&#101;&#59;&#10;&#32;&#116;&#111;&#112;&#58;&#48;&#59;&#10;&#32;&#98;&#111;&#116;&#116;&#111;&#109;&#58;&#48;&#59;&#10;&#32;&#114;&#105;&#103;&#104;&#116;&#58;&#48;&#59;&#10;&#32;&#108;&#101;&#102;&#116;&#58;&#48;&#59;&#32;&#10;&#32;&#112;&#97;&#100;&#100;&#105;&#110;&#103;&#58;&#32;&#53;&#48;&#112;&#120;&#59;&#10;&#32;&#98;&#97;&#99;&#107;&#103;&#114;&#111;&#117;&#110;&#100;&#45;&#99;&#111;&#108;&#111;&#114;&#58;&#32;&#35;&#70;&#69;&#69;&#59;&#10;&#32;&#104;&#101;&#105;&#103;&#104;&#116;&#58;&#97;&#117;&#116;&#111;&#59;&#10;&#125;&#10;&#35;&#105;&#110;&#110;&#101;&#114;&#32;&#123;&#10;&#32;&#104;&#101;&#105;&#103;&#104;&#116;&#58;&#49;&#48;&#48;&#37;&#59;&#10;&#32;&#98;&#97;&#99;&#107;&#103;&#114;&#111;&#117;&#110;&#100;&#45;&#99;&#111;&#108;&#111;&#114;&#58;&#32;&#35;&#70;&#68;&#68;&#59;&#10;&#125;&#10;&#60;&#47;&#115;&#116;&#121;&#108;&#101;&#62;&#10;&#60;&#100;&#105;&#118;&#32;&#105;&#100;&#61;&#34;&#111;&#117;&#116;&#101;&#114;&#34;&#62;&#10;&#32;&#60;&#100;&#105;&#118;&#32;&#105;&#100;&#61;&#34;&#105;&#110;&#110;&#101;&#114;&#34;&#62;&#60;&#47;&#100;&#105;&#118;&#62;&#10;&#60;&#47;&#100;&#105;&#118;&#62;&#10;&#10;&#60;&#47;&#98;&#111;&#100;&#121;&#62;&#60;&#47;&#104;&#116;&#109;&#108;&#62;

Ответы [ 3 ]

1 голос
/ 02 августа 2011

это ошибка в IE6 и IE7 .. вам нужно установить внешний div с фиксированной высотой, чтобы внутренний div работал правильно.

измени свой CSS на что-то вроде этого 

<style>
#outer {
 position: absolute;
 top:0;
 bottom:0;
 right:0;
 left:0; 
 padding: 50px;
 background-color: #FEE;
 height:140px; /* notice the height is in pixels not % */
}
#inner {
 height:100%;
 background-color: #FDD;
}

все заработало бы. Вы можете использовать javascript, чтобы идентифицировать браузер и соответственно применить CSS.

0 голосов
/ 02 августа 2011

для #outer не используйте height:auto.Сделай это height:100%.

0 голосов
/ 02 августа 2011

, если родитель уже в полный рост, вы должны использовать height: 100%, а не position.

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

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

...