Lad os være opmærksomme på ulemperne ved float. Hvordan blok- og inlineelementer opfører sig med hinanden, og om de skal bruges sammen. Lad os analysere, hvad et tab er, og hvordan vi skal håndtere det.
På trods af at vi i den sidste artikel byggede et simpelt gitter til stedet ved hjælp af floats, er de oprindeligt beregnet til at justere strømmen af elementer i teksten. Float har tre betydninger: venstre - elementerne holder sig til venstre margen; højre - elementer presses til højre kant; ingen - Wrap-tilstand er deaktiveret.
Et flydeindpakket element kan dimensioneres og polstres, men hvis elementet er inline, vil det opføre sig som et blokelement.
.block1 {
flyde: venstre;
bredde: 150px;
}
.block2 {
flyde: højre;
bredde: 150px;
}
Der er et andet problem, når du bruger floats, som falder ud af strømmen. Det ser ud, når blokkene går efter hinanden, men kun en af dem har flydeegenskaben, så vil den være oven på resten, fordi den ikke ser andre blokke. Inline-elementer vikles rundt om flydelementer, men blokken, der indeholder denne tekst, forbliver under flydelementet.
Men hvordan interagerer float med float?
De opfører sig som tekst: de står efter hinanden, så længe der er ledig plads, og flytter derefter til en ny linje. Derfor begyndte vi at bygge gitre ved hjælp af flyde. Hvis der ikke er plads tilbage, flyttes de ud over webstedets bredde, dvs. de går ingen steder.
Hvis svømmeren ikke ser enkle blokelementer, kan blokelementerne læres at se flyderen. Vi bruger den klare egenskab, som deaktiverer indpakning fra alle sider (eller fra udvalgte). Det vil sige, at et element med klart vil falde under elementet med float.
