Autor Zpráva
Anonymní
Profil *
Ahoj, mam trisloupcovy design delany klasicky tak, ze postranni sloupce jsou pomoci float : left a float : right s pevnou sirkou a prostredni sloupec je udelany pomoci margin-left a margin-right

V prostrednim sloupci je hlavni obsah. Problem je v tom, ze pokud v nem chci jeste pouzit plovouci prvek (obtekani obrazku) a pak dam <br style="clear : both"/>, tak se dalsi obsah presune az uplne na konec stranky.

Pseudozdrojak:

CSS:

#left { width : 100px; float : left; }
#right { width : 100px; float : right; }
#center { margin : 0 100px 0 100px; }

HTML:

<body>
<div id="left">
.
.
.
.
.
.
</div>

<div id="right">
.
.
.
.
.
.
</div>

<div id="center">
<img src="obr.jpg" style="float : left"/>
Text vedle obrazku

<br style="clear : both"/>
Text, ktery by mel byt hned pod obrazkem a textem vedle obrazku
</div>
</body>

No a problem je ten, ze ten text, ktery ma byt pod obrazkem se objevi az pod obema postrannimi sloupci, tedy clear : both se neaplikuje na obrazek, ale na sloupce :(

Diky za kazdou radu ...
Anonymní
Profil *
OK, tak jsem na to prisel ... kdyby nekdo nekdy resil podobny problem, zde je reseni:

Staci udelat prostredni sloupec plovouci smerem vlevo:

CSS:

#left { width : 100px; float : left; }
#right { width : 100px; float : right; }
#center { margin : 0 100px 0 0; float : left; }

HTML:

<body>
<div id="left">
.
.
.
.
.
.
</div>

<div id="right">
.
.
.
.
.
.
</div>

<div id="center">
<img src="obr.jpg" style="float : left"/>
Text vedle obrazku

<br style="clear : both"/>
Text, ktery by mel byt hned pod obrazkem a textem vedle obrazku
</div>
</body>

Neocekavane snadne :)
Toto téma je uzamčeno. Odpověď nelze zaslat.

0