Saya mengalami masalah dengan google chrome yang tidak merender svg dengan tag img. Ini terjadi saat memuat ulang halaman dan pemuatan halaman awal. Saya bisa mendapatkan gambar untuk muncul dengan "Memeriksa Elemen" lalu mengklik kanan file svg dan membuka file svg di tab baru. Gambar svg kemudian akan ditampilkan di halaman asli.
<img src="../images/Aged-Brass.svg">
Benar-benar bingung di sini tentang apa masalahnya. Gambar svg ditampilkan dengan baik di IE9 dan FF hanya saja tidak di Chrome atau Safari.
Saya telah menyetel jenis MIME saya juga. (gambar / svg + xml)
EDIT: Berikut adalah halaman html sederhana yang saya buat untuk membantu menggambarkan masalah saya.
<!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>
Seperti yang Anda lihat, saya mencoba menggunakan file svg di tag img dan di css sebagai gambar latar belakang. Tidak ada yang berfungsi pada pemuatan halaman awal di chrome atau safari. Ketika saya memeriksa elemen klik kanan svg atau klik tautan ke svg memuat di jendela lain file svg akan dirender di tab asli.
