1

いくつかのテキストと、高さと重量のパーセント値を持つ svg を含む単純なページをテストすると、svg の前後に余分なスペースができました。Firefox には余分なスペースはありませんが、Safari と Chrome では見つけることができます

これはsvgコードです:

       <svg id="uno" xmlns="http://www.w3.org/2000/svg" 
        viewBox="0 0 500 250"
        width="100%"
        height="100%"
        preserveAspectRatio="xMidYMid meet">
        <polygon points="1, 20 500, 1 220, 250"
            style="fill:#FFFFFF;
            stroke:#000000;stroke-width:5"/>
        <text x="47" y="42" font-size="24" fill="red" font-weight="bold">Colombini Locusta</text>

        <text x="45" y="44" font-size="24" color="black" font-weight="bold">Colombini Locusta</text>
        <rect x="200" y="100" width="70" height="70" style="fill:red"/> 
    </svg>

余分なスペースが作成される理由を理解するための提案はありますか?

ありがとうございました。

4

1 に答える 1