html - SVG - 流体布局 - 流体容器内的文本缩放

Question

我有一个嵌入在 bootstrap span12 div 中的 SVG 文档。

<div class="box span12">
<svg xmlns="http://www.w3.org/2000/svg"  version="1.1" viewBox="0 0 100 100" preserveAspectRatio="none">
<text y="10" width="20">Hello World</text>
</svg>
</div>

我希望我的 SVG 使用 span12 容器动态扩展，这是我使用 viewBox 属性完成的。我还希望 SVG 元素内的文本在左侧“浮动”并且具有 SVG 文档的 20% 宽度，因此我可以将其他元素放在右侧。我已将宽度设置为 20，但由于某种原因，我的文本没有在 SVG 内缩放到 20%，而是在整个文档上缩放。

我在这里做错了什么？

谢谢