Asi hodinu som sa pozeral na obrázok, čo si mi Radovan (admin) poslal a analyzoval som, čo ako urobím. Zistil som, že bude treba hlavičku, 4 nejaké stĺpčeky a pätičku. Otvoril som si PSPad, vytvoril si index.php a nastav.css. Do indexu som samozrejme naincludoval to, čo bude treba a vytvoril si príslušné súbory s xhtml kódom pre dané div-y. Podstatnejší ale bol css súbor. Začal som pekne od nuly, na prázdnom "papieri". V Adobe Photoshop som si otvoril obrázok, čo si mi poslal(viď odkaz vyššie) a nastavil farby, ktoré budem potrebovať. Išiel som od hora smerom dole. Hlavičku nebol problém vytvoriť, asi najľahšie;))
Pätička nasledovala potom. Ťažším orieškom ale bolo horné a dolné menu, aby vyzeralo identicky v Internet Explorer, Firefox a Opera. Po asi troch dňoch sa mi to konečne podarilo:) Menu(robené ako zoznam) vyzeralo k svetu, nech si sa pozrel odkiaľkoľvek(IE, FF, O). Ľavé menu. Jednoduchá záležitosť. Zoznam, kde som si nadefinoval pár farieb, odkazov a nebol problém, aby išlo rovnako pod spomínanými prehliadačmi.
No a dostávam sa k tej najzložitejšej časti celého layoutu, ktorý mi ukradol dosť času, preto to trvalo aj značne dlho. A síce je tým všetko ostatné. Druhý stĺpec problémom nebol, kedže sa stačilo pohrať s margin-om;) Ale tak jednoduché to nebolo. Pretože nastúpili posledné dva stĺpce. Ten, kde sú diskusie a ten, kde je vedúcim členom anketa. Neustále sa mi stávalo, že tieto dva stĺpce(div-y) sa mi zobrazovali vždy až pomyslene pod druhý stĺpec zľava(výpis článkov). Najprv som skúsil pozicovať absolútne, lenže IE neposlúchal, preto som miestami nevedel nájsť tú správnu cestu. Potom mi ale svitlo a všetko išlo tak, ako ide;)) A síce, druhý stĺpec má nastavenie float:left, štvrtý stĺpec má float:right no a stĺpec, kde sú diskusie elegantne padol medzi ne bez toho, aby bolo potrebné extra nastavenie.
Potom to trebalo už len doladiť, myslím detaily, ale to je triviálna záležitosť;) Takže asi toľko k tvorbe layout-u ako takého. Len tak pre zaujímavosť, daný css súbor má niečo okolo 800 riadkov;)
pjotr
Autor: Pjotr