Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS] Układ z floatami
Forum PHP.pl > Forum > Przedszkole
Scrooge
Chciałbym uzyskać układ jak na obrazku. kombinuje, kombinuje i nic :/ Do momentu gdy był ten układ bez niebieskiej ramki (bez lewego dolnego menu) było wszystko pięknie i się układało. Gdy dodałem tą ramkę z właściwością float:left i clear:left się wszystko rozleciało :/ Jak to zrobić??



Uproszczony kod-przykładowy(jak ja to widzę... ale nie działający dobrze) dla tego układu to:
Kod
<html>
<head>
</head>

<body>
<div style="border:2px solid; width:100px; height:200px; float:left;">cos1</div>
<div style="border:2px solid; width:100px; height:200px; float:left;clear:left">cos2</div>
<div style="border:2px solid; width:300px; height:300px; clear:none;">cos3</div>
<div style="border:2px solid; width:100px; height:100px; float:right;">cos4</div>
<div style="border:2px solid; width:100px; height:100px; float:right; clear:right;" >cos5</div>
</body>

</html>


co robię źle?? Dodam jeszcze tylko, że te dwa menu po prawej i dwa po lewej są floatami jak łatwo się domyśleć. Ramka pośrodku (chyba) nie powinna być floatem.

Crossforum:http://www.forumweb.pl/viewtopic.php?p=200754#200754
tiraeth
Pokażę Ci schemat divów:
Kod
-- WRAPPER
---- LEFT COLUMN
------ GREEN BOX with content
------ BLUE BOX with content
---- CENTER COLUMN with content
---- RIGHT COLUMN
------ RED BOX with content
------ YELLOW BOX with content
-- CLEANER (css - clear:both)


Spróbuj teraz to przerobić na CSS smile.gif
Scrooge
yyyyyyyyyyyy a co to jest "schemat divów" questionmark.gif?

[EDITED]

Oki już wiem ocb smile.gif
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.