当涉及利润率时，<svg>的宽度如何确定？

Question

这似乎是一个<svg>元素的宽度是基于集合父的大小，但忽略边距：

这是为什么？我怎样才能使<svg>的行为像任何其他block元素，当涉及到大小？

小提琴：http://jsfiddle.net/4p3ww/

Answer 1

没有办法对一些SVG内容说就是了占用任何空间后边框，填充可用和利润都采取自己的份额（有没有方法来创建SVG由于“宽度”和“高度”属性默认为100％，因此它没有固有的宽度/高度）。

https://wiki.mozilla.org/SVG:Sizing

好像有仍然在不同的浏览器应该如何呈现这些辩论，所以我要小心。即使有高度/宽度属性和max-width CSS，它对我来说仍然很奇怪。

http://jsfiddle.net/4p3ww/3/

Answer 2

只要不使用<svg>和<img>，好像他们是块元素。他们不是（Is <img> element block level or inline level?）。

如果你换你<svg>与contained类按您例如<div>，你会得到更符合你所期望的结果：http://jsfiddle.net/gLndw/