Pourquoi les ensembles de champs ne sont-ils pas redimensionnés pour s'adapter au contenu débordant ?

Problème de redimensionnement avec contrainte de largeur minimale

Problème :

les éléments ne redimensionnent pas leur largeur comme prévu lorsqu'ils contiennent du contenu débordant.

Cause :

Par défaut,

les éléments ont une contrainte de largeur minimale de min-content, ce qui signifie qu'ils ne seront jamais plus étroits que la largeur intrinsèque de leur contenu.

Correction :

Pour remplacer ce comportement par défaut , vous pouvez définir la largeur minimale : 0 ; sur le

. Cependant, cela ne fonctionne que dans WebKit et Firefox 53.

Solution de contournement spécifique à Gecko :

Dans les versions antérieures de Firefox, vous pouvez en outre définir la propriété d'affichage du < ;ensemble de champs> à l'une des valeurs suivantes :

• table-cell (recommandé)
• table-column
• table-column-group
• table-footer-gr oup
• table-header-group
• table-row
• table-row-group

Est @-moz-document Sûr ?

Pour ce problème spécifique, l'utilisation de @-moz-document pour masquer la solution de contournement spécifique à Gecko aux autres navigateurs est justifiée. Cependant, il est généralement déconseillé d'utiliser @-moz-document pour cibler Firefox.

Solution JavaScript :

Si vous devez prendre en charge des navigateurs autres que WebKit et Firefox 53 , vous pouvez utiliser JavaScript pour définir manuellement la largeur du champ

à la valeur souhaitée.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!