以下代码：
<!DOCTYPE html>
<html>
<head>
<title>Test.</title>
</head>
<body>
<div style="border: solid 1px black; height:100px; width:100px">
<svg height="100" width="100" viewBox="00 0 100 100">
<path id="map1" d="M210 10 L90 10 L90 90 " fill="red"/>
</svg>
</div>
</html>
JSfiddle：http://jsfiddle.net/HRsvX/
在Chrome和FF4显示div与边框和图像的一部分是SVG对象的INSIDE. svg之外的所有内容都没有绘制.
IE9显示全部SVG图像.是功能还是错误？有没有办法削减“出站”的图像部分？
拉斐尔框架是否正确处理这种情况？
解决方法
编辑：鉴于我的
new understanding of the spec,我必须在下面纠正自己.
svg命名空间中的元素规范所需的默认样式是：
svg,symbol,image,marker,pattern,foreignObject { overflow: hidden }
svg { width:attr(width); height:attr(height) }
每http://www.w3.org/TR/SVG/styling.html#UAStyleSheet
所以,如果你想要IE9符合你可以使用：
svg:not(:root) { overflow: hidden; }
如建议here和here.
如果默认overflow：hidden被覆盖,则为true：
根据SVG Spec,当包含在使用CSS的文档中时,SVG会像任何其他元素一样处理溢出.元素内部的项目溢出,除非overflow：hidden或overflow：如果它们超出父级的大小,则滚动.
在你的例子中,我看到它的路径超过svg元素定义的viewBox.由于默认溢出是可见的,所以路径将会超出svg元素的边界.另外,它超出了svg元素的父边界等.