In all other browsers I get the SVG to appear as 80% of page width. However in Safari i get a reduced size svg within a much larger scrollable (horiz & vertical) area.
I've been reading around and I think the problem is that safari needs .xhtml (it doesn't parse svg in .html), this however as you can see is .php so I've changed the header/content-type... but still nothing. Any ideas?
<?php header('Content-Type: application/xhtml+xml; charset=utf-8'); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" />
<style>
#svgobject{width: 80%;margin-right:auto;margin-left:auto;}
</style>
</head>
<body>
<object type="image/svg+xml" id="svgobject" data="question0final.svg" >
</object>
</body>
</html>
question0final.svg
look like?