Inline SVG with Text

The following has been drawn with inline SVG.

We go across , then we go down , then across again

Inline-SVG with Text Code Snippet

<html>
<svg width="750" height="400">
    <defs>
    <path id="MyPath" d="M 50 70 l 210 0 l 100 300 l 300 0" />
    </defs>
    <use xlink:href="#MyPath" fill="#cccccc" stroke="orange" stroke-width="5px"  />
    <text font-family="Verdana" font-size="30" fill="blue" >
    <textPath xlink:href="#MyPath">
        We go 
        <tspan dy="0" fill="orange" > across </tspan>
        <tspan dy="0"> , </tspan>
        then we go
        <tspan dy="0" fill="#0092BF"> down </tspan>
        <tspan dy="0"> , </tspan>
        then across again
    </textPath>
    </text>
</svg>
</html>