overflow
La propriété overflow définit la façon dont est géré l'affichage du contenu lorsque celui-ci déborde de son bloc.
Pour que cette propriété fonctionne, il faut que la hauteur du bloc soit limitée par une propriété height ou max-height ou bien avoir la propriété white-space avec nowrap comme valeur.
Les valeurs que peut prendre la propriété overflow sont:
<style>
.bloc {
width: 400px;
height: 80px;
border: 1px dotted black;
}
</style>
Une marchande de foie
Qui vendait du foie
Dans la ville de Foix.
Elle se dit ma foi
C'est la première fois
Et la dernière fois
Que je vends du foie
Dans la ville de Foix.
Si vous avez un autre bloc sous ce bloc, il sera en partie recouvert ce qui risque de donner un mauvais résultat.
overflow: hidden;
Une marchande de foie
Qui vendait du foie
Dans la ville de Foix.
Elle se dit ma foi
C'est la première fois
Et la dernière fois
Que je vends du foie
Dans la ville de Foix.
Une marchande de foie
Qui vendait du foie
Dans la ville de Foix.
Elle se dit ma foi
C'est la première fois
Et la dernière fois
Que je vends du foie
Dans la ville de Foix.
La propriété overflow accepte une ou deux valeurs. Avec une seule valeur, celle-ci s'appliquera à la largeur et à la hauteur de la boîte. Si vous donnez deux valeurs, la première valeur concernera l'axe horizontal de la boîte et la deuxième valeur concernera l'axe vertical. Voyez les propriétés overflow-x et overflow-y. Si vous ne voulez faire apparaitre qu'une ou l'autre des barres de défilement, ces propriétés vous le permettent.