2008-09-18 22 views
11

Używam tabeli do zaprojektowania układu mojej strony internetowej. Chcę, aby tabela wypełniała stronę, nawet jeśli nie zawiera zbyt wielu treści. Oto CSS Używam:Jak rozciągnąć tabelę HTML do 100% wysokości okna przeglądarki?

html, body { 
    height: 100%; 
    margin: 0; 
    padding: 0; 
} 

#container { 
    min-height: 100%; 
    width: 100%; 
} 

I umieścić coś takiego w kodzie strony:

<table id="container"> 
<tr> 
<td> 
... 

To działa na Operze 9, ale nie dla Firefox 2 lub Internet Explorer 7. Czy Czy istnieje prosty sposób, aby to rozwiązanie działało dla wszystkich popularnych przeglądarek?

(Dodanie id="container" do td nie pomaga.)

Odpowiedz

8

Wystarczy użyć właściwości height zamiast nieruchomości min-height podczas ustawiania #container. Gdy dane staną się zbyt duże, tabela automatycznie się powiększy.

18

Spróbuj użyć tego:

html, body { 
    height: 100%; 
} 

Więc oprócz dokonywania wysokość stołu do 100%, również powinien mieć pewność, że html'd i wysokość ciała są również 100%, więc będzie rozciągnąć prawidłowo .