SVG文本不居中firefox

我有一個SVG標誌與文本，文本居中。而這工作正常在鉻和IE瀏覽器，但不是Firefox，文本稍微移動到左側。SVG文本不居中firefox

<text transform="matrix(0.9287 0 0 1 60.9023 137.7646)"> 
    <tspan x="0" y="0" fill="#FFFFFF" stroke="#FAFAF8" stroke-miterlimit="10" font-family="'Consolas'" font-size="71.5163" letter-spacing="9.691">SOC</tspan> 
    <tspan x="-24.809" y="85.819" fill="#FFFFFF" stroke="#FAFAF8" stroke-miterlimit="10" font-family="'Consolas'" font-size="71.5163" letter-spacing="9.691">KING</tspan> 
</text>

請幫忙。

來源

2015-04-25 theWhiteFox

Firefox具有不同的變換原點基礎。有很多與這件事有關的問題。 - 檢查左側的相關問題。 –

好的，謝謝你會看看相關的。希望我會在那裏找到一些東西。 – theWhiteFox

Firefox尚不支持SVG文本上的letter-spacing CSS屬性。 –

行，所以我想出了一個解決辦法，以獲得字母間距相同的兩個Chrome和Firefox。我所做的是將兩者都添加到text-transform：letter-spacing =「9.691」textLength =「780px」並調整x，直到兩個瀏覽器在圖像中心顯示文本。它不漂亮，但它的作品。

<text transform="matrix(0.9287 0 0 1 60.9023 137.7646)" letter-spacing="9.691" textLength="780px" font-weight="bold"> 
     <tspan x="1" y="0" fill="#FFFFFF" font-family="'Consolas'" font-size="71.5163">SOC</tspan> 
     <tspan x="-21.8" y="85.819" fill="#FFFFFF" font-family="'Consolas'" font-size="71.5163">KING</tspan> 
    </text>

來源

2015-04-28 11:52:04 theWhiteFox

使用text-anchor="middle"居中文本（當時它的x座標點到中心）

來源

2015-04-27 10:38:24

text-anchor =「middle」在chrome中調整（調整x值）middle chrome！= middle firefox。試圖加入＆標籤。然後，當我嘗試使用letter-space或textLength時 - 我在Chrome中更正了（更改x值），而不是Firefox。我的問題是如何在firefox中給空格（字距調整）SVG文字加上字母。 SOC KING – theWhiteFox

SVG文本不居中firefox

回答

相關問題