problem z prawidłowym pozycjonowaniem div-ów

[TomS]

Mam ponoiższy kod css. Usiłuje umieścić stopkę na dole kontenera, tak by zawsze znajdowała się na końcu strony (nie na dole okna przeglądarki). Bez wzgledu czy div-a ze stopką wpisuje w kontenerze czy za nim stopka jest nadpisuje się nad nagłówkiem. Co jest z tym kodem nie tak?

Kod: Zaznacz cały

#kontener {
            position: relative;
			margin-left: auto; 
			margin-right: auto; 
			width: 770px; 
			background-color: none;
			text-align: justify;
             }

#naglowek{
			position: absolute;
			background-color: gray;
			width: 770px; 
			}

#lewa_kolumna{
			position: absolute;
			top: 20px;
			left: 0px;
			right: 150px;
			float: left;
			width: 150px;
			background-color: white;
			}

#prawa_kolumna{
			position: absolute;
			top: 20px;
			right: 0px;
			float: right;
			background-color: navy;
			width: 150px;
			height: auto;
				 }

#srodek{
			position: absolute;
			top: 20px;
			left: 1px;
			right: 1px;
			width: 468px;  			
			background-color: red;
			margin-left: 150px; 
			margin-right: 150px;
			height: auto;
		   }

#stopka{
		clear: both;
		width: 770px;
            background-color: #BCBCBC;
		height: 25px;
	  }

[Stig]

Prawda jes taka, że absolutne pozycjonowanie elementów jest nie najlepszym rozwiązaniem. Tak naprawdę czynność tą należy oprzeć o takie atrybuty jak: float, display, margin czy padding. Jeśli po kodzie arkuszu stylów dobrze zrozumiałem Twoje intencje to taki cel można osiągnąć następująco:

Kod: Zaznacz cały

#kontener { 
margin: 0 auto; 
width: 770px; 
text-align: justify; 
} 

#naglowek { 
background-color: gray; 
width: 770px; 
} 

#lewa_kolumna, #prawa_kolumna { 
float: left; 
width: 150px; 
background-color: white; 
} 

#prawa_kolumna { 
background-color: navy; 
} 

#srodek { 
float: left;
width: 470px;            
background-color: red; 
} 

#stopka {
clear: both; 
width: 770px; 
background-color: #BCBCBC; 
height: 25px; 
}

Gdzie markup wygląda następująco:

Kod: Zaznacz cały

<div id="kontener">
 <div id="naglowek">header</div>
 <div id="lewa_kolumna">left</div>
 <div id="srodek">center</div>
 <div id="prawa_kolumna">right</div>
 <div id="stopka">footer</div>
</div>

Jeżeli ten kod nie spełnia Twoich oczekiwań to napisz szczegółowo jaki cel chcesz osiągnąć, a na pewno postaramy się pomóc .

[TomS]

Dzięki, dokładnie o to chodziło.

Pozdrawiam
Tomek