Tengo un svg donde hay un video de fondo e imágenes y texto encima, En teoría el svg carga de arriba abajo del código pero en chrome y en opera esto funciona.
~<svg class="img-responsive" version="1.1" preserveAspectRatio="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="500" height="300" viewBox="0 0 500 300">
<foreignObject width="500" height="300">
<video autoplay="autoplay" loop="loop" class="a491" x="0" y="0" >
<source src="https://animacionesweb.online/videos/Spaceship-33411g.mp4" type="video/mp4"></source>
</video>
</foreignObject>
<text x="40" y="30"
font-family="Verdana" font-size="25"fill="blue">soy un texto,grafico y imagen encima d eun video
</text>
<circle cx=100 cy=100 r=50 fill="#ddd"></circle>
<image xlink:href="https://animacionesweb.online/imagenes/imagenesclientes/nave6.png" width="133" height="64" x="0" y="0"></image>
</svg> ~
Un ejemplo mas claro es aquí https://animacionesweb.online example example miralo en los diferentes exploradores alguien sabe alguna solución gracias ,