Autor Zpráva
gasp0
Profil *
Dobry den
Mam mensi problem s css layout. Mam dva stlpce vedla seba a potreboval by som to spravit aby sa mi ten druhy predlzoval automaticky podla obsahu toho prveho. Dakujem za radu
Georgík
Profil
Dobrý den.

Jsem rád za Váš zájem o CSS layout.

Já to nedělám, ale někdy asi není vyhnutí. Princip spočívá v rafinovaném pozadí obalového DIVu.

Pokud kostra vypadá takto:

<html>
<head>
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="pragma" content="no-cache" />
<meta http-equiv="expires" content="0" />
<meta http-equiv="content-type" content="text/html; charset=windows-1250" />
<style media="all" type="text/css">
.obalka {background-image:url(./linka.gif);background-repeat:repeat-y;}
.sloupec1 {float:left;width:200px;margin:0px;}
.sloupec2 {width:auto;margin:0px 0px 0px 200px;}
</style>
</head>
<body class="vse_musi_byt_pod_kontrolou">
<div class="obalka">
<div class="sloupec1">
</div>
<div class="sloupec2">
</div>
</div>
</body>
</html>

, potom se jako pozadí obálky použije průhledná linka (cca GIF) o výšce jeden pixel a šířce větší, než jsou normální (i nenormální) rozlišení. V našem případě bude průhlednost pod DIVy sloupců přerušena dvěma barevnými pruhy právě o šířce oněch příslušných sloupců (DIVů).

Tato dvoubarevná linka se potom nechá opakovat do konce obálky, čímž proužky vytvoří "sloupce" právě o výšce vyššího ze sloupců, protože přes oba je samozřejmě uzavřena obálka.

Samozřejmě jde o precizní prácičku, protože to musí "sedět" jak pro IE, tak dnes i pro Firefox.

Napište, jestli se zadařilo, nebo jsem něco popletl.

Mnoho štěstí. Jirka
Toto téma je uzamčeno. Odpověď nelze zaslat.

0