Podstawowy layout strony na divach

Odpowiedz Nowy wątek
2011-07-24 22:29
wicio95
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 ;]

Pozostało 580 znaków

2011-07-24 22:52
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.

Pozostało 580 znaków

2011-07-25 08:09
wicio95
0

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

Pozostało 580 znaków

Odpowiedz
Liczba odpowiedzi na stronę

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