Inspecteur CSS Stacking Context dans Chrome avec OffiDocs

DESCRIPTION

Avez-vous déjà essayé d'utiliser la propriété z-index, juste pour découvrir que, quelle que soit sa valeur, cela ne fonctionnera pas comme prévu ? C'est parce que la propriété z-index repose sur un concept implicite appelé "contextes d'empilement".

Après avoir recherché ce qu'ils sont et comment ils fonctionnent (informations que vous pouvez trouver sur MDN), vous pouvez utiliser cette extension devtools pour inspecter ces contextes et résoudre tout problème de z-index auquel vous pourriez être confronté.

Cette extension ajoutera un nouveau panneau qui affichera les contextes d'empilement dans une arborescence, et ajoutera également une nouvelle barre latérale au panneau des éléments avec des informations utiles sur l'élément sélectionné.

Pour consulter une documentation détaillée, veuillez vous référer à la page github : https://github.

com/andreadev-it/stacking-contexts-inspector Si vous souhaitez signaler un problème ou faire une demande de fonctionnalité, veuillez utiliser la section Problème du référentiel github susmentionné.

JOURNAL DES MODIFICATIONS : • v.

1.1.13 - Déplacé vers le manifeste v3. Ajout de l'index z au panneau latéral du panneau de contexte d'empilement également.

•v.

1.1.12 - Correction d'un bogue avec des propriétés préfixées par le fournisseur non détectées lors de la vérification des contextes d'empilement.

•v.

1.1.11 - Ajout de la valeur z-index à la section "Détails du contexte" dans la barre latérale.

•v.

1.1.10 - Suppression des demandes d'autorisation inutiles pour se conformer à la politique de sécurité de CWS.

•v.

1.1.9 - Implémentation de l'inspection des nœuds DOM contextuels dans les iframes et shadowDOM.

Désormais, l'extension fonctionne également sur les fichiers locaux (file:/// scheme).

•v.

1.1.8 - Ajout d'un avertissement lorsque la page change, prise en charge du DOM fantôme et des paramètres de base.

•v.

1.1.7 - Petites corrections de style.

Maintenant, il est également disponible sur Firefox en raison de quelques modifications mineures du code.

Code nettoyé.

•v.

1.1.5 - Correction d'un bug lié à la transition des modules CSS (spinner sans style).

•v.

1.1.4 - Ajout du thème sombre (auparavant, il était inutilisable avec le thème sombre activé).

•v.

1.1.3 - Correction d'un bug sur la navigation des pages.

•v.

1.1.2 - Ajout de la prise en charge des iframes sans l'attribut "src" (certaines iframes avec "src" peuvent fonctionner, mais cela ne devrait pas être attendu).

De plus, l'indicateur de chargement a également été introduit dans la barre latérale (panneau des éléments), et la barre latérale a désormais son propre bouton "Actualiser les contextes".

•v.

1.1.1 - Correction d'un bug où les contextes statiques créés par leur parent ayant un flex d'affichage ou une grille n'étaient pas détectés.

•v.

1.1.0 - Désormais, l'extension fonctionne sur les onglets qui étaient déjà ouverts lors de son installation.

- Le menu contextuel du clic droit a été remplacé par des boutons contextuels, car il ne fonctionnait pas correctement (il pourrait être ajouté à nouveau dans le futur).

- Désormais, la page de l'arborescence des contextes affichera un indicateur de chargement lorsque le contexte d'empilement prend beaucoup de temps à se charger.

- Du côté des développeurs, tout le code a été déplacé vers preact, comme première étape pour le rendre open source.

•v.

1.0.1 - Petits changements d'accessibilité et ajustements visuels.

Informations supplémentaires:

- Offert par Andrea Dragotta
- Note moyenne : 3.92 étoiles (aimé)
- Développeur cette adresse e-mail qui est protégée du spam. Vous devez activer JavaScript pour la voir.

Web de l'inspecteur CSS Stacking Context extension intégré avec les OffiDocs Chromium en ligne