Floating

postat acum 4 ani de Stefanescu Mihai in categorie CSS

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 larightleft sau both.

Sunt un tanar programator din Bucuresti ce lucreaza in PHP/Mysql (MySqli/PDO), Laravel, CodeIgniter, MySQL, PostgreSQL, Wordpress, HTML5/CSS3, Sass, Photoshop si multe altele.
Google+ Community Facebook Group
Acest articol a fost mutat de pe vechea platforma.
Pentru orice eroare aparuta la mutare va rog sa ma contactati!

Comentariu postate de hermes belt la data de 14.05.2019
Needed to send you one very little observation to finally say thanks over again for these pleasing principles you've featured on this website. This is really shockingly open-handed with people like you to offer openly exactly what most of us might have made available for an ebook in order to make some dough on their own, principally considering that you could have done it in case you desired. Those thoughts as well worked to be the easy way to fully grasp most people have similar dream the same as my own to learn very much more in regard to this problem. I'm certain there are lots of more enjoyable sessions up front for individuals that take a look at your blog post.
Comentariu postate de yeezy boost 350 v2 la data de 17.05.2019
Thank you for each of your efforts on this blog. Ellie enjoys carrying out investigations and it's really simple to grasp why. My spouse and i learn all regarding the lively form you offer advantageous tips and hints on your web blog and as well strongly encourage response from visitors on the theme plus our own princess is undoubtedly starting to learn a great deal. Take advantage of the remaining portion of the year. You are doing a superb job.
Comentariu postate de nike air max shoes la data de 18.05.2019
I wanted to send you one tiny remark so as to thank you so much the moment again for those marvelous guidelines you've featured on this website. It's pretty generous of people like you giving extensively what a number of us could possibly have sold as an e book in order to make some dough on their own, notably given that you might have tried it in case you wanted. Those smart ideas as well worked like the great way to fully grasp that the rest have similar keenness just as my own to see whole lot more pertaining to this problem. I'm sure there are numerous more pleasant periods in the future for folks who scan through your website.