在 svg 元素内对齐 use 元素

Question

我正在尝试将 svg 元素内的 use 元素对齐到最左端。我尝试了 text-align: left 和 text-anchor: start 但 use 元素仍然位于 svg 元素的中间。

<div class="guy">
    <svg><use xlink:href="#guy"></use></svg>
</div>

Answer 1

添加 preserveAspectRatio="xMinYMid" 例如

<div style="display: none"><svg id="guy" viewBox="0 0 123.6 205.2" preserveAspectRatio="xMinYMid">

或作为 fiddle

Align use element inside the svg element