Ist inline-SVG keine Option für dich?
Eher nicht, da die tatsächlich verwendete SVG (deutlich umfangreicher) von Inkscape generiert wird und damit ggf. nachbearbeitet wird.
Eine Trennung von html und svg spart da sicher eine Menge Copy & Paste.
(Wobei ein Skript dafür natürlich auch nicht so kompliziert wäre.)
Okay das ist ein Argument. Aber gehen wir mal weiter ins Detail:
@preserveAspectRatio scheint der Schlüssel zu deinem Problem zu sein. Problematisch ist, dass dieses Attribut nur im svg-Namesraum bekannt ist. Wie wäre es mit folgendem Ansatz:
<html xmlns="http://www.w3.org/1999/xhtml/" xmlns:svg="http://www.w3.org/2000/svg">
[...]
<svg:image src="DeineInkscapeDatei.svg" preserveAspectRatio="xMidYMid meet"></svg:image>
[...]
</html>
Der obige Code basiert allerdings nur auf meinem schlechten SVG-Halbwissen.
Ich hatte schon daran gedacht, das SVG als Background zu setzen, was in Opera auch klappte. In Iceweasel (Firefox unter Debian) leider nicht.
Das wäre auch nur ein schlechtes Workaround, weil eventuelle Skript-Manipulationen und zum Beispiel Hyperlinks verloren gehen.
PS: In deinem html-Tag fehlt die Namensraum-Deklaration.
Ich hab den HTML Stub von http://de.selfhtml.org/html/allgemein/grundgeruest.htm genommen. Ist eine Namensraum-Deklaration nicht nur für XML/XHTML nötig?
Korrekt und was steht in deinem doctype? html oder xhtml :P