Floating

Ce este Floating?

Cu Float putem “impinge” un element HTML spe stanga sau spre dreapta permitandu-le altor elemente sa se aseze langa ele.

Float-ul se foloseste de obicei pentru imagini, dar poate fi folosit si pentru alte elemente la fel de simplu.Elementele primesc float orizontal, asta inseamna ca nu putem folosi aceasta proprietate pentru a impinge elementele decat spre stanga sau spre dreapta, nu putem sa le impingem in sus sau in jos.Un element cu float se va duce spre stanga sau spre dreapta cat se poate de mult, adica pana la marginea elementului parinte.Elementele urmatoare se vor aseza in jurul lui, iar elementele dineintea lui nu vor fi afectate.Ex: Daca o imagine are float left atunci textul se va aseja in partea dreapta a imagini.

.imagineaMea{
float: left;
}

Aranjarea elementelor unul langa altul

Daca pui mai multe elemente cu float unul langa celalalt ele se vor aseja unul langa celalalt in limita spatiului disponibil.Mai jos avem codul CSS petnru un meniu orizontal folosind proprietatea float:

.menuItem{
    float: left;
    width: 90px;
    height: 24px;
    margin: 5px;
}

Float si Clear

Pentru a impiedica elementele ce urmeaza dupa float sa se aseze in pagina in functie de float putem folosi aceasta proprietate: clear.

.noFloat{
clear: both;
}

Cu acest element putem specifica ce parte a float-ului nu este permisa sau ambele, deci putem seta clear-ul laright, left sau both.