Klar - CSS-triks

Anonim

Den clearegenskap er direkte relatert til flottører. Hvis elementet kan passe horisontalt i rommet ved siden av et annet element som er flytende, vil det. Med mindre du bruker cleardet elementet i samme retning som flottøren. Da vil elementet bevege seg ned under det flytende elementet.

Her er et enkelt eksempel på en layout konstruert med flottører, noe som kan være problematisk for bunnteksten:

Men ved å fjerne bunntekstelementet, klikker oppsettet på plass:

#footer ( clear: both; )

I dette tilfellet, klart: begge deler; ble brukt for å sikre at bunnteksten tømmer tidligere elementer som svever i begge retninger. Men du kan også fjerne det ene lefteller righti hvilket tilfelle elementet vil bevege seg under elementene som er svevet i den retningen, men ikke den andre.

En vanlig måte å fjerne flottører på er å bruke et pseudo-element på et containerelement som rydder flottøren. Lær mer om det her.

Nettleserstøtte

Den clearEiendommen fungerer i alle nettlesere.