Maison > interface Web > tutoriel CSS > Comment puis-je résoudre les problèmes de Flexbox dans Internet Explorer 11 ?

Comment puis-je résoudre les problèmes de Flexbox dans Internet Explorer 11 ?

Patricia Arquette
Libérer: 2024-12-28 16:24:30
original
292 Les gens l'ont consulté

How Can I Fix Flexbox Problems in Internet Explorer 11?

Résoudre les problèmes de Flexbox dans IE

Impossible d'exploiter Flexbox dans IE11 ? Ce problème survient en raison de la difficulté d'IE à analyser la propriété flex. Voici plusieurs solutions de contournement :

Utilisation des propriétés longues

Évitez d'utiliser la propriété flex abrégée (par exemple, flex : 0 0 35 %). Utilisez plutôt les propriétés à long terme :

  • flex-grow : 0
  • flex-shrink : 0
  • flex-basis : 35 %

Activation de Flex-shrink

Assurer flex-shrink est activé dans votre déclaration flex. Essayez de modifier votre code de flex: 0 0 35% à flex: 0 1 35%.

Réponse aux variations de valeur de base Flex

IE11 présente différents comportements avec flex- valeurs de base. Expérimentez avec ces variations :

  • flex : 1 1 0
  • flex : 1 1 0px
  • flex : 1 1 0%

Faites attention aux minificateurs qui convertissent 0px en 0, ce qui peut provoquer un débogage problèmes.

Utilisation de Flex : Auto

Remplacez flex : 1 par flex : auto, ce qui implique :

  • flex-grow : 1
  • flex-rétrécissement : 1
  • flex-base : auto

Cela empêche l'effondrement des éléments lors de la transition de la direction flexible de ligne à colonne dans les requêtes multimédias.

Utilisation des propriétés de largeur/hauteur à l'ancienne

Envisagez de revenir aux propriétés traditionnelles de largeur et de hauteur au lieu d'utiliser flex.

Adoption de la disposition des blocs

Dans certains cas, la disposition des blocs (affichage : bloc) peut remplacer de manière adéquate la disposition flexible (affichage : flex ; flex-direction : colonne) dans des contenants spécifiques.

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!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal