Možná bych to řešil takhle : (není to z mojí hlavy).
#obal {backgroung: url('barva1.gif') top left repeat-y;}
#oblal2 {width: 600px; background: url('barva2.gif') top right repeat-y; }
#A,#B,#C { display: inline;}
#A{
background-color: silver;
margin-left: 200px;
float: left;
width: 200px;
}
#B{
background-color: yellow;
float: left;
width: 200px;
}
#C{
backgrounf-color: pink;
margin-left: -600px;
float: left;
width: 200px;
}
#hlavicka{
background-color: aqua;
}
#paticka{
clear: left;
background-color: violet;
width: 100%
float: left;
}
.clear { clear: both; }
a HTML kód je pak
<body>
<div id="obal">
<div id="obal2">
<div id="hlavicka">Hlavička</div>
<div id="A">Sloupec A</div>
<div id="B">Sloupec A</div>
<div id="C">Sloupec A</div>
<div id="paticka">Patička</div>
<br class="clear" />
</div>
</div>
</body>
Ono totiž navrhnout rozumné a funkční kaskády pro layout stránky není zase taková stranda, zejména pokud se týče kompatability s různými prohlížeči. Možná by bylo rozumnější použít primárně tabulkový layout a v css řešit jen "lokální" věci. Dá se tím předejít docela mnoha problémům.
|