SVG Quagmire

I'm stuck in a quagmire and wondered if anyone might offer a way out. I'm posting the problem here because it results in a display problem although not Garland specifically.

I'm trying to modify my site to make use of SVG inline graphics for some pages. I have been successful getting it to work for both Firefox and IE but under completely different situations. This is where the quagmire comes in.

1. Firefox
In order to make SVG work properly, you MUST use application/xhtml as the content-type and then add the appropriate namespaces into the html. Inline SVG in the node must be namespaced, but it works great. The problem is that I also use TinyMCE on my site for editing. It now no longer works because document.write is invalid when using application/xhtml. I'd like to keep the xhtml type in place for all nodes so that any node can have embedded graphics rather than a specific node type.

2. Internet Explorer
Okay, this browser simply SUCKS! That having been said, what I've been able to determine is that IE WILL NOT render SVG with a DOCTYPE. IE has to go into quirks mode in order to render SVG. If I add a DOCTYPE to my page.tpl file, then the SVG will no longer appear. Remove it and it comes back. The problem is that if I don't have a DOCTYPE, then I get erratic behavior from the site due to some of the Garland CSS attributes. For example, the table is defined with a width:100%. What happens with a DOCTYPE removed is that my three columns (two-sidebars + content), get emitted one after the other down the page. Put the DOCTYPE back in and the page renders properly.

I have not tried Opera or other browser yet but I suspicion that they will behave more like FF. IE seems to be the lone screw-up from what I've read and researched.

Any ideas?