LarryMatte

<svg width="400" height="200">
	<symbol id="myCircle" viewbox="0 0 800 100">
		<circle cx="25" cy="25" r="25" />
	</symbol>

    <use xlink:href="#myCircle" x="100" y="50" />
</svg>

LarryMatte

<svg width="400" height="200">
	<symbol id="myCircle">
		<circle cx="25" cy="25" r="25" />
	</symbol>
	<use xlink:href="#myCircle" x="100" y="50" />
</svg>

LarryMatte

<svg width="400" height="200">
	<defs>
		<circle id="myCircle" cx="25" cy="25" r="25" fill="red"/>
		<circle id="myCircle-2" cx="25" cy="25" r="25"/>
	</defs>

	<use xlink:href="#myCircle" x="100" y="50"/>
	<use xlink:href="#myCircle" x="200" y="50" fill="blue" stroke-width="3" stroke="green"/>
	<use xlink:href="#myCircle-2" x="300" y="50" fill="blue"/>
</svg>

LarryMatte

<svg width="400" height="200">
	<defs>
		<circle id="myCircle" cx="25" cy="25" r="25"/>
	</defs>

	<use xlink:href="#myCircle" x="100" y="50"/>
	<use xlink:href="#myCircle" x="200" y="50"/>
</svg>

LarryMatte

<svg width="400" height="200">
	<circle id="myCircle" cx="100" cy="100" r="25"/>  

	<use xlink:href="#myCircle" x="100" y="0"/>
	<use xlink:href="#myCircle" x="200" y="0"/>
</svg>

LarryMatte

<svg>
    <g fill="red">
	<rect x="10" y="10" width="50" height="80" fill="blue"/>
	<rect x="80" y="10" width="50" height="80"/>
	<rect x="150" y="10" width="50" height="80"/>
    </g>
</svg>

LarryMatte

<svg>
    <g fill="red">
	<rect x="10" y="10" width="50" height="80"/>
	<rect x="80" y="10" width="50" height="80"/>
	<rect x="150" y="10" width="50" height="80"/>
    </g>
</svg>

LarryMatte

<svg width="200" height="150" viewBox="0 0 100 75" >
    <rect x="10" y="20" width="100" height="50" fill="red" stroke="blue" stroke-width="5"/>
</svg>

LarryMatte

<svg width="200" height="150" viewBox="0 0 200 150" >
    <rect x="10" y="20" width="100" height="50" fill="red" stroke="blue" stroke-width="5"/>
</svg>

LarryMatte

<svg width="200" height="150" viewbox="15 25 <width> <height>">
	<rect x="10" y="20" width="100" height="50" fill="red" stroke="blue" stroke-width="5"/>
</svg>