Нека обърнем внимание на недостатъците на поплавъка. Как блоковите и вградените елементи се държат помежду си и дали да ги използват заедно. Нека анализираме какво е загуба и как да се справим с нея.
Въпреки факта, че в последната статия изградихме проста мрежа за сайта с помощта на плувки, те първоначално са предназначени да коригират потока от елементи в текста. Float има три значения: ляво - елементите се придържат към левия поле; вдясно - елементите се притискат към десния ръб; няма - режимът на увиване е деактивиран.
Елемент, обвит с плувка, може да бъде оразмерен и подплатен, но ако елементът е вграден, той ще се държи като блоков елемент.
.block1 {
плувка: ляво;
ширина: 150px;
}
.block2 {
плувка: вдясно;
ширина: 150px;
}
Има друг проблем при използване на плувки, който пада от потока. Появява се, когато блоковете отиват един след друг, но само един от тях има свойството float, тогава той ще бъде върху останалите, защото не вижда други блокове. Вградените елементи ще се увиват около плаващи елементи, но блокът, съдържащ този текст, ще остане под елемента float.
Но как float взаимодейства с float?
Те се държат като текст: стоят един след друг, докато има свободно място, и след това се преместват на нов ред. Затова с помощта на плувки започнахме да изграждаме мрежи. Ако не остане място, те се преместват отвъд ширината на сайта, тоест не отиват никъде.
Ако поплавъкът не вижда прости блокови елементи, тогава блоковите елементи могат да бъдат научени да виждат поплавъка. Използваме свойството clear, което деактивира опаковането от всички страни (или от избраните). Тоест елемент с clear ще попадне под елемента с float.
