Věnujme pozornost nevýhodám floatu. Jak se bloky a vložené prvky chovají navzájem a zda je používat společně. Pojďme analyzovat, co je ztráta a jak s ní zacházet.
Navzdory skutečnosti, že v minulém článku jsme pro web vytvořili jednoduchou mřížku pomocí plováků, jsou původně určeny k úpravě toku prvků v textu. Float má tři významy: left - elements stick to the left margin; vpravo - prvky jsou stlačeny k pravému okraji; žádný - režim zalamování je deaktivován.
Plovoucí prvek může být dimenzován a polstrován, ale pokud je prvek vložený, bude se chovat jako prvek bloku.
.block1 {
plavat vlevo;
šířka: 150px;
}
.block2 {
float: správně;
šířka: 150px;
}
Při používání plováků dochází k dalšímu problému, který vypadává z proudu. Objeví se, když bloky jdou jeden po druhém, ale pouze jeden z nich má vlastnost float, pak bude nad ostatními, protože nevidí další bloky. Vložené prvky se zalomí kolem plovoucích prvků, ale blok obsahující tento text zůstane pod plovoucím prvkem.
Jak ale float interaguje s floatem?
Chovají se jako text: stojí jeden po druhém, dokud je na něm volné místo, a poté se přesunou na nový řádek. Proto jsme pomocí plováků začali stavět mřížky. Pokud nezbývá místo, přesunou se za šířku webu, to znamená, že nikam nevedou.
Pokud float nevidí jednoduché blokové prvky, pak lze blokové prvky naučit vidět float. Používáme vlastnost clear, která zakazuje zalamování ze všech stran (nebo z vybraných). To znamená, že prvek s clear spadne pod prvek s floatem.
