Floaty vs. Pozíciovanie

blizzboz:
kombinaci

blizzboz:
Někdo místo <div>u používá <br> jako cleaner, možností je víc. Já mám v CSS
Do HTML pak píšu <hr class="hr">.

Osobně mám radši pozicování levého bočního sloupce, má-li být přes celou výšku stránky.
V případě kratšího boxu vlevo je však otázka, není-li vhodnější obtékání, díky němuž nepřijde vniveč jinak nevyužitý prostor.

blizzboz:
co se layoutu týče, používají se layouty floatované, s pozicovanými se musí umět zacházet.
Pozicování je v některých případech nezbytné, avšak drtivá většina věcí, jež jsou pozicované, mezi ty nezbytné případy nepatří.

„ale nevýhoda je že musím používať cleaner takže napr. za zoznamom ul u horizontálneho menu musím pridať ešte jeden prázdny div“
...nebo přidat clear: both; k prvku, jež v kódu následuje.

Petr ZZZ:
„Do HTML pak píšu <hr class="hr">.“
je jedno, čím se čistí, ale <hr> se mi osobně moc nelíbí - s vypnutými styly nebo při tisku pak máš vodorovné linky i tam, kde jsou zbytečné. Ty se mohou používat např. pro oddělení bloků kódu (obsah, hlavička, patička), proto jim na tisku nelze dát display: none; (pokud je tedy jako oddělovač používáš).

„Někdo místo <div>u používá <br> jako cleaner“
je to mj. kvůli tomu, že <br> je kratší a nepárové nerozdíl od <div>u.

<br> jako čistič? Spíš <hr>, ne?

A já čistič nepoužívám. Overflow to řeší. Když jsem u vodorovných linek, tak ty používám, jak tu už padlo, k oddělení logických částí obsahu (např. při tisku): hlavička, menu, obsah, patička, ...

Dranel:
<hr> také používám jako oddělovač v prostém HTML (display:none).
V případě potřeby čističe pak mohu jednu <hr> explicitně změnit na display:block s visibility:hidden a clear:both.

Miloš:
„<br> jako čistič? Spíš <hr>, ne?“
Podle odpovědí, které jsem ve vláknu Jak vnutit <hr> nulové marginy? dostal od Plaváčka a habendorfa, by šlo i "oboje": <br class="hr">. :)

panther:
„s vypnutými styly nebo při tisku pak máš vodorovné linky i tam, kde jsou zbytečné.“

Díky za zajímavý postřeh. Zapřemýšlím nad tím, možná ale přijdu na to, že tam, kde je čistič, případná linka zas tak nevhodná nebude, takže by se dala skousnout. Je ale pravda, že když jí dám v CSS visibility:hidden; – tak ji tam nechci, takže na tom, co píšeš, něco je.

Při tisku si ale zneviditelním co chci (stejně jako při normálním zobrazení). Jinak taky používám hrčka pro čištění, mám je zrovna tam, kde při vypnutých stylech je vhodné oddělit bloky stránky. A nebo dám čistič přímo následnému divu.

Pokud nemá blok pevnou velikost, pak se plovoucím blokům nevyhneš. Nemusíš ale používat žádný čistič (cleaner) - pokud chceš pod plovoucími bloky mít ještě další - ale stačí použít clearfix, divím se, že to tu ještě nikdo nenapsal.

joe:
Proč takové obludy kvůli jedné jediné věci, proboha? Stačí obalu přidat šířku a overflow:auto|hidden; viz. http://www.quirksmode.org/css/clearing.html

Dranel:
Clearfix je čistější řešení, než použití čističe, protože nejsou přidávány žádné další HTML tagy. Jseš si jistý, že to "tvé" řešení funguje i na složitých layoutech v IE6?

Obluda = pár bajtů? ...

joe:
„protože nejsou přidávány žádné další HTML tagy“
Ani u čističe není nutno přidávat žádné další HTML tagy. Stačí třída v CSS, např. .hr jako jsem uvedl v [#3], a tu pak přidáš jakémukoli blokovému prvku, který následuje (je-li důvod ukončit obtékání, následuje nějaký blok vždy).

„Jseš si jistý, že to […] funguje i na složitých layoutech v IE6?“
Odkaz, který jsi uvedl v [#11], je v IE6 otřesně rozhozený. Jestli podobně "funguje" tamní clearfix, tak potěš koště. :-)

joe:
Však já také žádné přidávání HTML tagů nedoporučuji. A ano, weby testuji také v IE6 a ještě jsem s tím neměl problém. Obludu jsem nemyslel ve smyslu velikosti (bajty), nýbrž čistoty. Mé řešení přidá jednomu elementu dvě vlastnosti (z nichž jednu už může mít předem stanovenou - šířku). Tvé řešení je na 17 řádků.

EDIT: A tam, kde z nějakých důvodů nelze použít overflow (víceúrovňová hover menu), použiji opět float. :-)

Petr ZZZ:
Clearfix je ověřená metoda a v IE6 funguje správně. Tímhle co poslal Dranel si nejsem tak jistý, teď to vyzkoušet nemůžu.

A lepší je používat to, co skutečně funguje, než si naběhnout a pak se s tím nějakou chvíli trápit, že nevím proč je to jinak než jsem původně chtěl.

Dranel:
Schválně si to otestuju :-) až najdu nějakou volnou chvilku a budu mít funkční PC s IE. Pokud to funguje, tak to je samozřejmě lepší řešení než ten clearfix. Mám ale zkušenosti jen s tím a nikdy jsem se nepátral po jiném, protože vím, že funguje.

Petr ZZZ:
„Odkaz, který jsi uvedl v [#11], je v IE6 otřesně rozhozený. Jestli podobně "funguje" tamní clearfix, tak potěš koště. :-)“
clearfix tam funguje (to jsou ty dva příklady se zeleným a žlutým boxem), rozpadá se zbytek stránky.

Reaguji na joa:
„Clearfix je ověřená metoda a v IE6 funguje správně.“
Řekl bych, že šířka + overflow funguje spolehlivěji a bez hacků. Odkázaný clearfix počítá s tím, že prohlížeč buď je Explorer, nebo umí pseudoelement :after.

„Clearfix je čistější řešení, než použití čističe, protože nejsou přidávány žádné další HTML tagy.“
Ale přidáváš tečku. Sice neviditelnou a při troše štěstí nezabírající místo… ale je to tečka.
Co je špinavého na přidání HTML elementu?

Chamurappi:
„Řekl bych, že šířka + overflow funguje spolehlivěji a bez hacků.“
Nevím, pokud tu píšete, že funguje, tak asi jo. Mně nedělá problém přidat si "svůj" clearfix :-) Až to vyzkouším a uvidím na vlastní oči, pak ho možná přestanu používat. Nevěděl jsem o tom, že se to dá udělat i tímto jednoduchým způsobem.

„Co je špinavého na přidání HTML elementu?“
Nic :-) Myslel jsem spíš používat pro čistič tagy jako jsou hr / br. Tak to je důvod proč raději použít klasický div. Protože ty další mohou být při tisku vidět, pokud na to člověk nemyslí - když vytváří CSS pro tisk.