I'm seeing inconsistent rendering of SVG <tspan> elements in regards to text-decoration.
Using this simple testcase:
<text font-family="Helvetica" x="0" y="50" font-size="30" text-decoration='underline overline'>
outer text
<tspan font-size="15" text-decoration="overline">tspan w. overline</tspan>
</text>
WebKit (~Safari 8)
Firefox (37)
Internet Explorer (11)
The section on text decoration doesn't seem to explain much.
Since ‘text-decoration’ is specified on the ‘text’ element, all text within the ‘text’ element has its underline rendered with the same fill and stroke properties as exist on the ‘text’ element (i.e., blue fill, red stroke), even though the various words have different fill and stroke property values. However, the word "different" explicitly specifies a value for ‘text-decoration’; thus, its underline is rendered using the fill and stroke properties as the ‘tspan’ element that surrounds the word "different" (i.e., yellow fill, darkgreen stroke)
There's some clarification of fill/stroke but nothing on font size. Does this mean this is left up to implementors' decision? Is this defined/explained anywhere else?