Podstawowy layout strony na divach

0

Hej, przerabiam sobie kurs z tej strony http://www.kurshtml.edu.pl/css/plynny_szablon,szablon.html i napotkałem problem, oto mój kod strony:

<html>
<head>

<meta http-equiv="content-type" content="text/html; charset=iso-8859-2">
	<title>TEST</title>
	
	
<style type="text/css" media="screen">	
html, body {
	background-color: #fff;
	color: #000;
	margin: 0;
	padding: 0;
}

#NAGLOWEK {
	background-color: #888;
}

#MENU {
	width: 200px;
	float: right;
	overflow: hidden;
	clear: both;
	position: relative;
	background-color: #ccc;
}

#TRESC {
	margin-right: 200px;
	background-color: #fff;
}

#STOPKA {
	width: 25%; 
	float: left;
	background-color: gray;
}

#STOPKA2 {
	width: 25%; 
	float: left;
	background-color: green;
}

#STOPKA3 {
	width: 25%; 
	float: left;
	background-color: blue;
}

#STOPKA4 { 
	width: 25%; 
	float: right;
	background-color: red;
}

</style>
	
</head>
<body>

<div id="top">
	<div id="NAGLOWEK">Nagłówek szablonu</div>
	<div id="MENU">Menu nawig acyjne <br><br><br><br><br><br><br><br><br><br><br><br></div>
	<div id="INFORMACJE">Dodatkowe informacje</div>
	<div id="TRESC"> Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony Treść strony</div>
	<div id="STOPKA">Stopka_serwisu_1</div>
	<div id="STOPKA2">Stopka_serwisu_2</div>
	<div id="STOPKA3">Stopka_serwisu_3</div>
	<div id="STOPKA4">Stopka_serwisu_4</div>
</div>

</body>
</html>

A tak wygląda strona w przeglądarce http://img28.imageshack.us/img28/5462/stronapif.jpg

Dlaczego div pomalowany na czerwono z numerem 4 tak się układa ? Jak wyrównać go z menu prawostronnego ?

Dzięki za pomoc :)

Przepraszam za double posta, ale chyba mało jasno napisałem o co mi chodzi, a więc chcę aby divy stopka_serwisu od 1 do 4 były ustawione w 1 rzędzie pod menu prawostronnym.

Dzięki ;]

0

Bo brakuje miejsca. Procentowy podział określa szerokość wobec elementu z wartością position inną niż default lub względem elementu body. I tak się dzieje w tym przypadku.

0

Czyli co powinienem zmienić w kodzie ? Kombinowałem ze zmianą wartości dla position, ale bez skutku...

1 użytkowników online, w tym zalogowanych: 0, gości: 1