Ha jól sejtem errõl az oldalról van szó, ami ezt a stíluslapot használja, és valószínûleg ezen iromány alapján készült.
Ha javasolhatnám, a CSS-kódot mindenek elõtt egyszerûsítsd:
1. A CSS-kód legelejére például tedd az alábbit:
* {
margin: 0;
padding: 0;
border: none;
}
Ezzel minden elem margóját, kitöltését, és szegélyét eltünteted. Ez azért jó, mert eltünteted a böngészõ alapbeállításaiból eredõ margókat, kitöltéseket és szegélyeket, és nem kell ezeket egyesével kinyírni (esetedben a body, #container, #left, #content, #right elemeknél) - tiszta lappal indulhatsz.
2. Ahol lehet, csoportosíts! Ahogy látom 3 blokkot - #left, #content, #right - egymás mellé akarsz "lebegtetni". A helyett, hogy mindegyiknél megadod: float: left;, vond össze a 3 elemet:
#left, #content, #right {
float: left;
}
3. A position: relative; CSS deklaráció megadása nem kell, csak a helyet foglalja.
Ha van egy, egysoros szöveged, amit egy blokk típusú elemen belül akarsz elhelyezni, a blokk magasságával megegyezõ line-height tulajdonsággal ruházol fel, akkor függõlegesen középre fog pozicionálódni a szöveg.
Tehát HTML-kódrészlet:
<div id="content"><pTartalom</p></div>
CSS-kódrészlet:
#content{
height:300px;
width:500px;
background-color:#FFCC00;
}
#content p {
line-height: 300px;
}
Viszont ha a HTML-kódban az adott blokkba több sor kerül: