Starší komentáře ke článku: Třísloupcový plovoucí CSS layout s relativním pozicováním
Zpět na článek | Úvodní stránka Interval.cz
Datum vložení: 15.3.2002 8:11:31
a co netscape 4.xx ? uplne ho odriznout od stylu ? co doporucujete ?
Datum vložení: 15.3.2002 8:14:29
No, bylo by to idealni :)
Datum vložení: 16.3.2002 11:50:22
V prvom rade by som rad upozornil na fakt, ze NN4 nepodporuje CSS vobec. Namiesto toho si jeho developeri vymysleli JSSS - JavaScript Style Sheets (to je prave dovod, preco s vypnutim podpory JS v NN4 zdanlivo nepochopitelne prestane fungovat aj CSS), pricom pri programovani nedodrzali ani vlastne specifikacie. Vysledkom je velmi chaba a casto chybna interpretacia CSS.
Co s tym? Je to jednoduche. Ked robite stranku, mali by ste v prvom rade zacat s cistym nenaformatovanym HTML dokumentom, ktory obsah formatuje podla jeho logiky zakladnymi tagmi (nadpisy, podnadpisy, odstavce, odrazky a pod.). Tym padom mate stranku ktora zarucene bude fungovat VZDY a VSADE. Potom si mozete dokument rozdelit podla potreby do logickych celkov (napr. pomocov tagov DIV ci SPAN) a pristupit k jeho formatovaniu pomocou CSS. Niektore veci NN4 zvlada, niektore nie. Tie, ktore nezvlada alebo interpretuje nespravne, pred nim schovajte metodou @import.
Myslim si, ze najdolezitejsou castou stranok je ich obsah. Forma bez obsahu je ako prazdny obal od hamburgeru. Pekny, ale bez zemle je mi na hovno. Aj v NN4 sa daju stranky pomocou CSS naformatovat tak, aby boli pouzitelne, prehladne a esteticke. Mozno sa vam ich nepodari rozlozit do variabilne sirokych stlpcov, ale obsah a funkcnost ostane zachovana vzdy.
A este jedna vec. Mali by sme si uvedomit, ze NN4 je zastarala verzia (1994!) prehliadaca, pricom existuje jeho nova verzia - NN6. O jeho kvalitach sa sice da diskutovat, ale je to aktualna verzia daneho prehliadaca, je na svete uz nejaky ten cas a CSS podporuje v uplne dostatocnej miere.
Datum vložení: 15.3.2002 8:15:19
Na to, že se tagy SCRIPT objevují v tagu BODY jsem si už zvykl. Ale ve Vaší ukázce jsem si všiml, že i tagy STYLE se objevují v BODY. Zde snad ani nemá význam opouštět tagy HEAD.
Jinak hezké, ale zjistil jsem, že levý sloupec, pokud je kratší nežli prostřední sloupec, prostě skončí dřív (zkuste v ukázce zúžit okno co nejvíce, aniž by se objevila vodorovná rolovací lišta a narolujte dolů). Netušíte jak levému sloupci přikázat aby byl alespoň tak vysoký jako prostřední??? Jde mi především o barvu pozadí levého sloupce - text tam už není a DIV prostě skončí.
Při použití tabulky jsou buňky vedle sebe stejně vysoké, jak toho docílit pomocí CSS?
Datum vložení: 15.3.2002 8:25:28
NO, to uz takovy muj zvyk davat styly do <body>. Samozrejme, idealne by mely byt v externim css souboru, ale pro clanek to nema smysl.
S tim levym sloupcem. Me to nedela...?. ALe neni mozne pomoci CSS udelat levy sloupec stejne jako prostredni sloupec. Snad pomoci JavaScriptu.
Datum vložení: 15.3.2002 21:23:15
Mam dojem, ze umistenim tech tri "obsahovych" sloupcu do spolecnyho DIVu a nastavenim jejich vejsky na 100% by to melo jit. Nejak takhle se mi to podarilo uchodit, jednou.
Datum vložení: 19.3.2002 10:12:45
Ve vší úctě, to asi chodit nemohlo. 100% výšky se vztahuje s výšce OKNA, nikoli k výšce DOKUMENTU.
Datum vložení: 19.3.2002 10:57:10
Tak to asi chodit nemohlo, ale chovalo se to presne tak, jak rikam. Podle me se ostatne vsechny rozmery, vcetne vejsky, vztahujou k velikosti rodicovskyho elementu, coz je v tomto pripade DIV a ne BODY nebo okno.
Datum vložení: 19.3.2002 11:04:56
Jo, takze presne takhle to opravdu nebylo, jenom obalit dalsim DIVem a tem vnitrkum dat height: 100%; nestaci. NEJAK se mi to ale udelat podarilo, cistym CSS. Akorat si nepamatuju, jak to bylo.
Datum vložení: 15.3.2002 12:42:46
dobry den
jestli jde hlavne o barvu pozadi, tak to jsem udelala tak, ze vlastne celou stredni cast se sloupcema schovam pod jeden box (div) ve kterem si nastavim levy barevny pruh jako pozadi, delka tohoto boxu se pak meni podle delky nejdelsiho sloupce
ast
Datum vložení: 26.5.2002 7:34:48
No myšlenka je to dobrá s tím boxem.
Protože pro náš IPS (internetový prezentační systém) jsem dával dohromady layout, který by měl korektně fungovat ve většině prohlížečů, nemyslím jen MSIE (ikdyž i mezi jednotlivými verzemi jsou rozdíly), tak jsem zjistil, že řešení s boxem, který obaluje sloupce v opeře nefunguje. Box je vždy tak dlouhý, jako nejdelší neplovoucí div. Aby to fungovalo v opeře, tak je potřeba pod sloupce do boxu vložit div s nastavením clear: both; a pak to funguje OK.
Datum vložení: 15.3.2002 9:43:28
miro, ty sloupce (text z nich) ti v mozille (a nejen v ní) <B>přetékají</B> do patičky, takľe tudy cesta asi
nevede.. :(
patičku přes celou ąířku takhle jednoduąe s css prostě <U>neuděláą</U>...
luci
Datum vložení: 15.3.2002 9:56:57
NO, dela to jenom Mozilla, IE 5.5 a Opera 6 jsou ok. Podle kodu nevidim duvod, proc by tomu tak melo byt. Jedna se tedy o problem Mozilly...?
Datum vložení: 15.3.2002 13:24:55
Ano, jedná se o problém, a to nejen u Mozilly. Pokud si skusíte jakékoli složitější formátování s <DIV>, pak prakticky jediným UA, který vše zvládne, je MSIE6. V závislosti na použitých prvcích odpadne i Netscape 6.2 a Opera 6. Zkrátka, layout založený na tabulkách je pořád ještě jedinou cestou (ačkoli osobně jsem proti).
Datum vložení: 15.3.2002 22:42:03
Tudy cesta <B>VEDE</B>. Zaráží mě takové ty
krátkozraké názory typu "takhle to prostě
nepůjde", jejichž autoři se ani nenamáhají
pochopit, proč se prohlížeč chová tak, jak se chová.
Mozilla se chová správně a determinovaně. Sloupce
přetékají jenom proto, že jim Mr. Kučera zadal "z
demonstračních důvodů" pevnou výšku. Protože však
mají implicitně overflow: visible, tak obsah
vyleze mimo rozměry boxu, avšak neovlivní chování
boxů přilehlých. Nevím, co těmi pevnými výškami
chtěl demonstrovat; stačí je však zrušit a
všechno bude fungovat perfektně.
Jinak tohle není nějak moc objevné, ale myslím,
že jde asi o nejelegantnější způsob, rozhodně
lepší než nějaké tabulky. Jen mě zmátl ten nadpis
-- tady přece není nic pozicovaného ve smyslu
vlastnosti position), a už vůbec ne relativně!
Vše je v běžném toku (mimo plaváčků, jistě), což
je jenom dobře.
Datum vložení: 18.3.2002 19:07:19
Zdravim vas,
rozhodne si nekladu paten na rozum,
a diky za kazdy takovy prispevek,
ktery je k veci a podnetny nejenom
pro samotneho autora, ale i pro ctenare.
Datum vložení: 8.1.2004 7:28:16
Ahoj,
resenim je zrusit pevne sirky jak psal Karel Fučík - bylo by mozne to opravit i v clanku (nebo na to alespon poukazat), protoze jsem se celkem dost dlouho trapil s tim proc mi to nefunguje. Ja totiz vzdy zkousim to co je popsano v clanku a teprve kdyz neco nefunguje zkousim diskuze.
Diky
Patrik
PS - mozna by nebylo spatne cas od casu clanky aktualizovat tak aby opravdu priklady fungovali tak jak je avizovane - <B>timto nechci kritizovat</B>, ja sam bych si s tim neporadil, ale prave pro takove zacatecniky jako ja je strasny problem zjistit kde je chyba, obzvlaste pokud berete clanek jako bezchybnou ukazku.
Datum vložení: 8.1.2004 7:29:39
Pardon chtel jsem napsat <B>zrusit pevne vysky</B>. Ted po ranu mi to nejak nemysli.
Patrik
Datum vložení: 15.3.2002 19:24:58
Co takhle zkusit někdy udělat tři sloupce aby prostřední byl vycentrován a mel fixní šírku a krajní se roztahovaly. No asi bych toho chtel moc...
Michal
Datum vložení: 18.3.2002 10:31:45
Implementace css přimo do html kodu je vše OK ale jakmile dam na nej odkaz tak uz to nejede...(u mě by mělo byt vše OK) tak nevím co stím...prosim poradte
Datum vložení: 7.4.2002 14:05:36
V zmíněném příkladě jste docílil zarovnání na střed pomocí odsazení od kraje. Při proměné velikosti sloupce je bohužel toto řešení na nic. Zajímalo by mě, jetli jde pomocí css definovat přesné umístění na střed, či jestli se musí sáhnout po JavaScriptu?!
Datum vložení: 8.4.2002 10:08:15
Jde to - pomoci margin: auto. Problem je ale to, ze hodnota auto neni podporovana v IE 5.0/5.5
Datum vložení: 29.4.2002 16:02:54
Třísloupcový plovoucí CSS layout s relativním pozicováním je super. Ibaze ak mam v strede stranky trebarz fotku s (nech s rozmerom 400 px) po zmenseni stranky mi "skoci" STRED az pod LAVY a PRAVY stlpec. Da sa STRED "zamknut" na minimalnu hodnotu tak, ze sranka sa sirkou da krasne roztahovat a stahovat, ale ak sa uz zmensi na ukor sirky stredu, nech pozicie zostanu a zacne sa uberat z pravej strany. PRESNE TAK si to predstavujem, ako JE ROBENA I TATO STRANKA.
Datum vložení: 28.7.2002 12:03:49
muze mi nekdo poradit, jak udelat, aby se mi nerozsirovali sloupce (<div>), kdyz obsahuji dlouha slova (delsi nez je sirka sloupce)?
Datum vložení: 28.9.2002 11:25:35
Dobrý den,
Reaguji na Váš článek Třísloupcový plovoucí CSS layout s relativním
pozicováním. Prošel jsem všechny Vaše články (včetně diskuzí) na téma
css layouty, a rozhodl jsem se udělat stránky podle nejnovějšího
článku.
Mám problém s tím, že když je text (např.) v prostředním rámci delší
než ve dvou okrajových, tyto se "useknou" a pod nimi je už jen barva
pozadí (viz příklad <a href='http://free.kvalitne.cz/priklad.zip)' target='_blank'>http://free.kvalitne.cz/priklad.zip)</a>. Poradíte mi prosím, jak docílit 3 stejných (byť
dole prázdných) rámců 3 barev?? Obrázek na pozadí použít nemůžu,
jelikož mám rámec jak zleva tak zprava.
--
S pozdravem
Jirka
Datum vložení: 6.5.2003 11:15:25
Když vymažu vlastnost height u všech sloupců, tak se mi střed posune mírně doleva po skončení levého sloupce. Vypadá to asi takto:
levý sloupec střed pravý sloupec
levý sloupec střed pravý sloupec
střed pravý sloupec
střed pravý sloupec
Provizorně jsem to vyřešil tak, že jsem střed a pravý sloupec dal do DIVu s vlastnostmi width: 78% a float: right. Je nějaký lepší způsob, jak to vyřešit ?
Díky
Datum vložení: 25.5.2003 18:58:14
Jo, staci tam dat (jak uz bylo receno) jeden div do body (nejsem si jist zda je to tak delano) a tomu dat clear: both.
Imho spravna metoda by byla
[div head][/div]
[div body]
[div levysloupec][/div]
[div pravysloupec][/div]
[div mainframe]
[div style='clear: both'][/div]
[/div]
[/div]
[div paticka][/div]
Datum vložení: 18.11.2003 16:58:40
Taky vytvářím web bez rámů. To není problém, ale vzhledem k tomu, že na každé stránce bude totožné menu nahoře i v levo, přijde mi krajně nepraktické mít tento stejný kus kódu v každém stránce natvrdo zadaný.
Napadá mne uložit tento kód pro horní menu i pro levé menu do samostatných souborů a do každé stránky je jen dotahovat. Otázkou ale je jak je dotáhnout do jednotlivých stránek? Víte jak na to ? K dispozici mám html a asp.
Dík Čalfa
Datum vložení: 18.11.2003 17:10:18
No prece pomoci direktivy #include :-)
Hledejte na intervalu :)
Datum vložení: 30.8.2007 17:29:21
Dakujem za poucne vyuzitie CSSka :)
Datum vložení: 10.4.2009 15:41:42
Bohužel mi tvůj návod nefunguje, Problém je hlavně s tím, že pravý sloupec je až pod středovým sloupcem. NEvím, ale já to nerozchodil tak, aby pravý dir byl tam kde má být. Existuje řešení pomocí obalu a clear:both koukni sem http://www.zshorakhk.cz/tvorba/ucitele/WWW/WWW%20-%20lekce%2027%20-%20t%C5%99i%20sloupce%20-%20float.htm tohle řešení je funkční. Tcladin z tcladin.cz