[CSS]Bez tabel

[Stef@n]

Witam,

Zaczynam nowa przygodę z pisaniem stron bez tabel. No i wszystko niby cacy zrobiłem sobie mały szablon, ale są pewnie niedociągnięcia które nie wiem jak poprawić. A w czym problem? No z ustawieniem div. W IE wszystko jest fajnie i tak jak powinno. A w FF niestety jeden div pokrywa się z innym zdjęciem. Podaje link do strony:

http://www.kozuchykorzen.pl

Bardzo proszę o pomoc i różne poprawki oraz komentarze do tego kodu abym mógł pogłębić zagadnienie robienia stron bez tabel.

kod CSS:

body {	background-color: #7390C4; margin-top: 7px; margin-left: 0; margin-right: 0; margin-bottom: 7; font-family: Tahoma; color: #000000; font-size: 12px; }p.naglowek {	margin-left: 15px; margin-top: 0px; margin-bottom: 0px; color: #FFFFFF; font-weight: bold; line-height: 22px; }#top {	background-color: #FFFFFF; width: 978px; margin: auto; }#logo {	width: 84px; height: 70px; padding-left: 30px; float: left; }#mini_menu {	width: 200px; float: right; text-align: right; margin-top: 20px; padding-right: 30px; display: run-in;  }#mini_menu ul {	display: inline; padding-left: 0px; margin-left: 0px; }#mini_menu li {	list-style-type: none; display: inline; padding: 5px; }#reklama_a {	background-color: #FFFFFF; width: 960px; text-align: center; margin: auto; margin-top: 5px; margin-bottom: 5px;  }#menu {	background-image: url(grafika/bg_menu.gif); width: 960px; margin: auto; line-height: 39px; font-weight: bold;}#menu ul {	display: inline; padding-left: 0px; margin-left: 0px; }#menu li {	list-style-type: none; display: inline; padding: 17px; }#lewa_kolumna {	width: 362px; padding-left: 10px; padding-top: 15px; float: left; }#logowanie_naglowek {	background-color: #7390C4; width: 362px; }#logowanie_formularz {	background-color: #D2DFEB; height: 150px; width: 362px; }#informacja {	padding-top: 15px; height: 150px; width: 362px; }#prawa_kolumna {	width: 586px; float: right; padding-right: 10px; padding-top: 15px; }#tekst {	width: 960px; padding-bottom: 15px; padding-top: 15px; text-align: justify; margin: auto; }#logo_stopka {	width: 58px; padding-left: 30px; float: left;  }#menu_stopka {	width: 860px; float: left; text-align: center; padding-top: 7px; }#menu_stopka ul {	display: inline; padding-left: 0px; margin-left: 0px; }#menu_stopka li {	list-style-type: none; display: inline; padding: 5px; }#tresc_stopka {	width: 860px; float: left; text-align: center; padding-top: 5px; }

Z góry dziękuje i czekam na mądre rady.

[benkowik]

Nie wiem, spróbuj może dać większy padding dolny przy informacja lub większy padding górny przy tekst

[piodor]

jeśli nie pasuje Ci to o czym myślę to daj margin-top:(próbuj różne wartości aż osiągniesz oczekiwany efekt) przy identyfikatorze tekst.

po drugie bez sensu zrobiłeś trochę cały układ strony.. wg mnie powinieneś to zrobić tak że definiujesz tylko stałą szerokość do jednej rzeczy np <div id="kontener"></div>

potem zagnieżdżasz wszystkie inne divy w tym z id="kontener" i definiujesz do nich szerokości względne, czyli najlepiej procenty w tym przypadku.