web-dev-qa-db-fra.com

Comment enquêter sur le message "La feuille de style ne peut pas être chargée" dans Firefox?

Comment enquêter sur le message "La feuille de style ne peut pas être chargée" dans Firefox? Ce message apparaît sous forme de barre rouge sous le contenu de la page et au-dessus des outils de développement. Comment savoir à quel fichier le navigateur fait référence? J'utilise la version 46.0 sous Linux Mint 17.3.

Mettre à jour

Si je regarde la console des outils du développeur dans Firefox, il affiche tous les fichiers CSS et indique "HTTP/1.1 200 OK" pour chaque fichier.

Une autre mise à jour

Cette barre d'erreur va et vient, elle n'est pas cohérente pour une page particulière.

cssfirefox
26
tyebillion

Cela se produit presque toujours lorsque CSS est gziped, mais le serveur retourne Content-Length de not ressource compressée. Cela se produit lorsque vous utilisez mod_deflate avec mod_fastcgi. Ceci est un bogue côté serveur, pas firefox. 

5
Bogdan Kuštan

Il s’agit peut-être d’un cas Edge très spécifique, mais j’ai eu cette erreur exactement la même, sans indication quant à la feuille de style à propos de laquelle Firefox se plaignait. Il s’avère que c’est le bloqueur de publicité que j’utilisais. Lorsque j'ai désactivé le bloqueur de publicités et rechargé ma page, l'erreur a disparu.

4
Mike Stoddart

Avis de mise à jour:

Firebug est obsolète. Si vous souhaitez utiliser Firefox Developer Edition , vous devez utiliser des outils de diagnostic et des outils de type Firebug. 

Obtenez Firebug , ou visualisez le code source de la page (cliquez dessus avec le bouton droit de la souris et choisissez Afficher le code source), puis cliquez sur chaque feuille de style .css comme indiqué dans la section <head> de la page HTML. Un ou plusieurs d'entre eux renverront une erreur 404 ou une autre erreur. 

Chaque feuille CSS est dans un élément <link> dans l'en-tête du code HTML. 

Exemple:

l'affichage du code source sur cette page donnera une pile de code. Dans la section <head> se trouve le <link>:

<!DOCTYPE html> 
<html itemscope itemtype="http://schema.org/QAPage"> 
<head> 
 ...
 <link rel="stylesheet" type="text/css" href="//cdn.sstatic.net/Sites/stackoverflow/all.css?v=8c7d44a438e6"> 
...
 </head>

Cela montre qu’il existe une feuille de style dans l’élément link, et pour votre page/site si vous cliquez sur toutes celles-ci (il peut y en avoir plusieurs) et recherchez celle qui vous donne l’erreur spécifique.

METTRE À JOUR:

(Mise à jour) Si je regarde la console des outils du développeur dans Firefox, il affiche tous les fichiers css et indique "HTTP/1.1 200 OK" pour chaque fichier.

Par conséquent, vous devriez consulter en chacun de vos CSS et des documents associés pour voir quel document est lié à une ressource inaccessible. 

2
Martin

Une autre raison pour style sheet could not be loaded est "contenu mixte actif" associé à HTTPS. C'est à dire. Si votre code HTML est chargé via HTTPS, mais fait référence à un CSS fourni via HTTP, Firefox bloquera le fichier CSS. Le blocage provoquera une entrée explicative dans la console Web. Voir https://developer.mozilla.org/en-US/docs/Web/Security/Mixed_content/How_to_fix_website_with_mixed_content pour plus d'informations.

Le blocage se produira également si la demande du fichier CSS est traitée via HTTPS avec une redirection et que l'URL de redirection utilise HTTP. De plus, Google Chromium bloquera le contenu mixte actif via HTTP et fera une entrée dans sa console Javascript.

0
user2845840

J'ai eu cette erreur de cette page stackexchange, j'ai eu la ligne rouge dans la console Firebug. Il a pointé vers le lien https://cdn.sstatic.net/Sites/stackoverflow/all.css?v=743e70f26396 donc j'ai vérifié la source de la page copier/coller le lien dans un nouvel onglet et appuyer sur Entrée. Firefox a crié une erreur de certificat de problème de sécurité, alors je viens d'ajouter une exception et les charges CSS. Cette erreur n'est pas apparue dans Chrome ou IE. 

Solution facile.

0
Bill Chappell