CSS: min-height DIVu określony w procentach nie działa

eGospodarka.pl › Grupy › pl.comp.www › CSS: min-height DIVu określony w procentach nie działa › CSS: min-height DIVu określony w procentach nie działa

Path: news-archive.icm.edu.pl!news.gazeta.pl!not-for-mail
From: "Marcin Połeć" <u...@N...gazeta.pl>
Newsgroups: pl.comp.www
Subject: CSS: min-height DIVu określony w procentach nie działa
Date: Sun, 12 Jul 2009 00:59:11 +0000 (UTC)
Organization: "Portal Gazeta.pl -> http://www.gazeta.pl"
Lines: 82
Message-ID: <h3bcgv$aie$1@inews.gazeta.pl>
NNTP-Posting-Host: localhost
Content-Type: text/plain; charset=ISO-8859-2
Content-Transfer-Encoding: 8bit
X-Trace: inews.gazeta.pl 1247360351 10830 172.20.26.240 (12 Jul 2009 00:59:11 GMT)
X-Complaints-To: u...@a...pl
NNTP-Posting-Date: Sun, 12 Jul 2009 00:59:11 +0000 (UTC)
X-User: utterqvist
X-Forwarded-For: 83.24.124.168
X-Remote-IP: localhost
Xref: news-archive.icm.edu.pl pl.comp.www:392858
[ ukryj nagłówki ]
Prosta sprawa, strona wygląda tak:

<head>...</head>
<body>
<div class="MainDiv">
<div class="Header">Header</div>
<div class="LeftSideColumn">menu</div>
<div class="Content">content</div>
</div>
<div class="Footer">Footer</div>
</body>

MainDiv ma minimum 100% wysokości ekranu i margines na stopke. Teraz chcę
żeby LeftSideColumn i Content miały ustawiną minimalną wysokość w taki
sposób żeby wypełniały całą przestrzeń między nagłówkiem a stopką, nawet gdy
nie ma w nich żadnej treści.

Mój css wygląda tak:
html, body {min-height: 100%; height: 100%;}

MainDiv {
min-height: 100%;
height: auto !important;
height: 100%;
width: 100%;
margin: 0 auto -28px;
}

Header {height: 54px;}

Footer {height: 28px;}

LeftSideColumn
{
float: left;
clear: left;
min-height: 100%;
height: auto !important;
height: 100%;
width: 15%;
}

Content
{
float: right;
clear: right;
min-height: 100%;
height: auto !important;
height: 100%;
width: 84.6%;
}

MainDiv ma taką wysokość jaką chcę, czyli 100% viewportu, ale dwa
zawierające się w nim divy (LeftColumn i Content) po ustawieniu min-height
na 100% nie mają 100% wysokości MainDiv tylko 0.

Chcę mieć taki układ strony:

--------------
* Header *
--------------
* * *
* L * *
* E * CONTENT*
* F * *
* T * *
* * *
--------------
* FOOTER *
--------------

Gdy min-height określam w px to wszystko jest ok, ale nie mogę tego zrobić
bo nie wiem jaką rozdzielczość ma ustawioną użytkownik. Gdy określam w % to
cały czas wysokość wynosi 0.

Chcę żeby left i content wypełniały cały obszar między header a footer,
nawet gdy nie ma w nich żadnej treści. Co zmienić?

--
Wysłano z serwisu Usenet w portalu Gazeta.pl -> http://www.gazeta.pl/usenet/