Attribut float CSS
Définition et utilisation
La propriété float définit dans quelle direction un élément flotte. Traditionnellement, cette propriété était appliquée aux images pour faire flotter le texte autour de l'image, mais dans CSS, n'importe quel élément peut flotter. Les éléments flottants génèrent un cadre en bloc, peu importe le type d'élément.
Si un élément non substituable flotte, il faut spécifier une largeur explicite ; sinon, ils seront aussi étroits que possible.
Remarque :Si il n'y a que très peu d'espace disponible pour un élément flottant sur une ligne, alors cet élément sautera à la ligne suivante, ce processus se poursuivra jusqu'à ce qu'une ligne ait suffisamment d'espace.
Voir également :
Tutoriel CSS :Positionnement CSS
Manuel de référence HTML DOM :Attribut cssFloat
Syntaxe CSS
float: none|left|right|initial|hérité;
Valeur de l'attribut
| Valeur | Description |
|---|---|
| gauche | L'élément flotte à gauche. |
| droite | L'élément flotte à droite. |
| aucune | Valeur par défaut. L'élément ne flotte pas et s'affiche à l'endroit où il apparaît dans le texte. |
| hérité | Définit que la valeur de la propriété float doit être héritée de l'élément parent. |
Détails techniques
| Valeur par défaut : | aucune |
|---|---|
| Héritabilité : | non |
| Version : | CSS1 |
| Syntaxe JavaScript : | object.style.cssFloat="left" |
Exemple à essayer
- Application simple de la propriété float
- Faire flotter une image à droite d'un paragraphe
- Faire flotter une image avec bordure et marge à droite du paragraphe
- Faire flotter une image à droite du paragraphe. Ajouter une bordure et une marge à l'image.
- Image avec titre flottant à droite
- Faire flotter une image avec un titre à droite
- Faire flotter la première lettre du paragraphe à gauche
- Faire flotter la première lettre du paragraphe à gauche et ajouter un style à cette lettre.
- Créer un menu horizontal
- Créer un menu horizontal en utilisant une flottaison avec des liens hypertextes en une colonne.
- Créer une page d'accueil sans tableau
- Créer une page d'accueil avec en-tête, pied de page, sommaire de gauche et contenu principal en utilisant la flottaison.
Support du navigateur
Les nombres dans le tableau indiquent la version du navigateur la première à prendre en charge cette propriété.
| Chrome | IE / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| 1.0 | 4.0 | 1.0 | 1.0 | 7.0 |
