15-06-2012, 20:04
Cześć,
mam problem, który ilustruje obrazek.
Jeśli treść w sekcji content jest mniejsza niż okno przeglądarki, chciałbym, żeby sekcja rozciągnęła się na całe okno. Jeśli natomiast jest większa to aside z menu ma być tej samej wysokości. Footer chciałbym mieć zawsze na końcu dokumentu (nie ma być przyklejony do dolnej krawędzie przeglądarki), ale jeśli treści jest mniejsza niż całość wolnego miejsca, footer powinien być przyklejony do krawędzi.
Niestety nie mogę uzyskać takiego zachowania. Sekcja srodkowa rozciąga mi się poprawnie dla:
html, body
{
height: 100%;
background: #3366FF;
margin:0px;
padding:0px;
}
ale jak mam za dużo tekstu to layout mi się rozlatuje. Natomiast jak dam
html, body
{
min-height: 100%;
background: #3366FF;
margin:0px;
padding:0px;
}
to layout mi się nie rozlatuje przy zbyt dużej ilości tekstu, ale jak jest tekstu za mało na całą stronę to footer znajduje się w połowie strony.
Tak samo ta sekcja środkowa nijak nie chce zajmować przyjajmniej całej wielkości ekranu.
Proszę o pomoc.
mam problem, który ilustruje obrazek.
Jeśli treść w sekcji content jest mniejsza niż okno przeglądarki, chciałbym, żeby sekcja rozciągnęła się na całe okno. Jeśli natomiast jest większa to aside z menu ma być tej samej wysokości. Footer chciałbym mieć zawsze na końcu dokumentu (nie ma być przyklejony do dolnej krawędzie przeglądarki), ale jeśli treści jest mniejsza niż całość wolnego miejsca, footer powinien być przyklejony do krawędzi.
Niestety nie mogę uzyskać takiego zachowania. Sekcja srodkowa rozciąga mi się poprawnie dla:
html, body
{
height: 100%;
background: #3366FF;
margin:0px;
padding:0px;
}
ale jak mam za dużo tekstu to layout mi się rozlatuje. Natomiast jak dam
html, body
{
min-height: 100%;
background: #3366FF;
margin:0px;
padding:0px;
}
to layout mi się nie rozlatuje przy zbyt dużej ilości tekstu, ale jak jest tekstu za mało na całą stronę to footer znajduje się w połowie strony.
Tak samo ta sekcja środkowa nijak nie chce zajmować przyjajmniej całej wielkości ekranu.
Proszę o pomoc.
