Mam problemy z Google Chrome, które nie renderuje pliku SVG z tagiem img. Dzieje się tak podczas odświeżania strony i początkowego ładowania strony. Mogę wyświetlić obraz, klikając „Inspecting Element”, a następnie klikając prawym przyciskiem myszy plik svg i otwierając plik svg w nowej karcie. Obraz svg zostanie następnie wyrenderowany na oryginalnej stronie.
<img src="../images/Aged-Brass.svg">
Zupełnie nie wiem, na czym polega problem. Obraz svg renderuje się dobrze w IE9 i FF, ale nie w Chrome lub Safari.
Mam też ustawione typy MIME. (obraz / svg + xml)
EDYCJA: Oto prosta strona html, którą stworzyłem, aby pomóc zilustrować mój problem.
<!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>
Jak widać, próbuję użyć pliku svg zarówno w tagu img, jak iw css jako obrazu tła. Nie działaj na początkowym ładowaniu strony w Chrome lub Safari. Kiedy sprawdzam element, klikam prawym przyciskiem myszy svg lub klikam link do wczytania svg w innym oknie, plik svg zostanie wyrenderowany w oryginalnej karcie.