Qu'est-ce que la propriété overflow ?
La propriété CSS overflow contrôle ce qui se passe lorsque le contenu d'un élément dépasse les dimensions de son conteneur. Elle détermine si le contenu débordant est visible, masqué, ou accessible via des barres de défilement. C'est une propriété fondamentale pour la gestion des mises en page et des composants d'interface.































































Demandes illimitées, résultats rapides
Soumettez autant de briefs que vous le souhaitez. Nos plans vous permettent de gérer un flux continu de demandes design, sans limite et sans friction, et à un coût économique.
Les valeurs d'overflow
visible (par défaut) laisse le contenu déborder. hidden masque tout ce qui dépasse — très utilisé avec border-radius pour découper des formes. scroll ajoute systématiquement des barres de défilement. auto n'affiche les barres que si nécessaire, c'est la valeur la plus courante en pratique.
Overflow-x et overflow-y
On peut contrôler le débordement horizontal et vertical indépendamment avec overflow-x et overflow-y. Cela permet par exemple de créer un carrousel horizontal (overflow-x: auto) tout en masquant le débordement vertical.































































Demandes illimitées, résultats rapides
Soumettez autant de briefs que vous le souhaitez. Nos plans vous permettent de gérer un flux continu de demandes design, sans limite et sans friction, et à un coût économique.
Conclusion
Overflow est une propriété CSS discrète mais cruciale pour des interfaces propres et fonctionnelles. Sa maîtrise permet d'éviter les débordements visuels indésirables et de créer des composants scrollables élégants.
À retenir
- Contrôle le comportement du contenu qui dépasse son conteneur
- 4 valeurs : visible, hidden, scroll, auto
- overflow-x et overflow-y pour un contrôle directionnel
- hidden + border-radius = découpe d'images
- auto est la valeur recommandée pour les conteneurs scrollables
Demandes illimitées, résultats rapides
Soumettez autant de briefs que vous le souhaitez. Nos plans vous permettent de gérer un flux continu de demandes design, sans limite et sans friction, et à un coût économique.