Нижний край не работает на% 100 div - PullRequest
Новая
       15

Нижний край не работает на% 100 div

0 голосов
/ 12 апреля 2011

У меня есть следующий HTML-код: 

<html>
 <body style="margin:0px; padding:0px;">
   <div id="outer" style="height:100%;">
     <div id="header" style="height:40px; background:blue;">Header</div>
     <div id="main" style="height:100%; margin-bottom:-40px; background:red; overflow:auto;">
        <p style="height:1000px">Main</p>
     </div>
   </div>
 </body>
</html>

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

Может кто-нибудь помочь мне с этим вопросом?

1 Ответ

0 голосов
/ 12 апреля 2011

Вы, похоже, решаете не ту проблему, на самом деле. Если вы просто хотите избавиться от полосы прокрутки для самого тела, установите стиль тела на overflow:hidden. 

<html>
  <body style="margin:0px; padding:0px;overflow:hidden;">
   <div id="outer" style="height:100%;">
     <div id="header" style="height:40px; background:blue;">Header</div>
     <div id="main" style="height:100%; margin-bottom:-40px; background:red; overflow:auto;">
        <p style="height:1000px">Main</p>
     </div>
   </div>
 </body>
</html>

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

...