Estou tendo problemas com o google chrome, não renderizando svg com uma tag img. Isso acontece ao atualizar a página e ao carregar a página inicial. Posso fazer com que a imagem apareça "Inspecionando Elemento", clicando com o botão direito do mouse no arquivo SVG e abrindo o arquivo SVG em uma nova guia. A imagem SVG será então renderizada na página original.
<img src="../images/Aged-Brass.svg">
Totalmente perdido aqui quanto ao problema. A imagem svg funciona bem no IE9 e FF, mas não no Chrome ou Safari.
Eu tenho meus tipos MIME definidos também. (imagem / svg + xml)
EDIT: Aqui está uma página html simples que criei para ajudar a ilustrar meu problema.
<!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>
Como você pode ver, estou tentando usar um arquivo svg em uma tag img e em css como imagem de fundo. Nenhum trabalho no carregamento da página inicial no Chrome ou Safari. Quando eu inspeciono o elemento, clique com o botão direito em svg ou clique no link para svg load em outra janela, o arquivo svg será renderizado na guia original.
