SVG文本在Firefox中被切断，与CSS / HTML结构无关

Question

Page传递验证器，适用于IE9和Chrome。但是我很清楚为什么文本会在Firefox中被切断？我试过玩CSS，改变标签的宽度和高度（没有做任何事情），改变了标签的绝对位置（仍然在完全相同的位置切断），几乎尝试了任何HTML / CSS明智。

截图： http://i44.tinypic.com/10qjp5t.png

Answer 1

将svg元素的width和height属性设置为100％。

Answer 2

添加属性“background-size”，并为其指定SVG图像的宽度和高度值，如下所示：background-size：（width）px（height）px;

因此，如果SVG的宽度为100px，高度为50px，请在SVG的CSS中使用以下规则： background-size：100px 40px;

此外，要添加对旧版浏览器的支持，请按照以下方式（和顺序）在SVG背景之前在SVG的CSS中定义回退png背景： background：url（fallback_image.png）no-repeat; background：url（svg_image.svg）no-repeat;

这是有效的，因为大多数支持SVG的浏览器也支持多个背景，因此将应用后一个背景（SVG）。如果浏览器不支持SVG，它将只使用第一个背景（非SVG）。

来源：http://css-tricks.com/using-svg