Je rencontre des problèmes avec Google Chrome qui ne rend pas svg avec une balise img. Cela se produit lors de l'actualisation de la page et du chargement initial de la page. Je peux faire apparaître l'image en "Inspecting Element" puis en cliquant avec le bouton droit sur le fichier svg et en ouvrant le fichier svg dans un nouvel onglet. L'image svg sera ensuite rendue sur la page d'origine.
<img src="../images/Aged-Brass.svg">
Totalement perplexe ici quant à la nature du problème. L'image svg rend bien dans IE9 et FF mais pas dans Chrome ou Safari.
J'ai également mes types MIME définis. (image / svg + xml)
EDIT: Voici une simple page html que j'ai créée pour illustrer mon problème.
<!DOCTYPE html>
<html>
<head>
<title>SVG Test</title>
<style>
#BackgroundImage{
background: url('../images/Aged-Brass.svg') no-repeat scroll left top;
width: 400px;
height: 600px;
}
#ImageTag{
width: 400px;
height: 600px;
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<div id="ImageTag">
<img src="../images/Aged-Brass.svg">
</div>
<div id="BackgroundImage"></div>
</body>
</html>
Comme vous pouvez le voir, j'essaie d'utiliser un fichier svg à la fois dans une balise img et en css comme image de fond. Aucun des deux ne fonctionne sur le chargement initial de la page dans Chrome ou Safari. Lorsque j'inspecte l'élément, cliquez avec le bouton droit sur svg ou cliquez sur le lien pour charger svg dans une autre fenêtre, le fichier svg sera rendu dans l'onglet d'origine.
