SVG posicionamiento como position: absolute

Question

estoy tratando de posicionar un elemento interno dentro del elemento raíz. El elemento raíz está configurado para ser 100% alto y 100% ancho. Sin embargo, quiero que el interior sea SVG 10px más o menos desde el borde exterior de la SVG - todos excepto el borde derecho, lo que me gustaría ser 200 píxeles desde el borde exterior derecho. Quiero esto para visualizar en un navegador web y lo que el usuario debe ser capaz de cambiar el tamaño del navegador y por lo tanto el exterior SVG SVG, mientras que el interior debe ser capaz de mantener la distancia correcta de la SVG exterior en cada lado.

De esta manera:

+OUTER SVG------------------------------------------+ 
|             | 
| +INNER SVG----------------+     | 
| |       |     | 
| |       |  200px   | 
| |       | <---+-----+----> | 
| |       |     | 
| |       |     | 1 
| |       |     | 0 
| |       |     | 0 
| |       |     | % 
| |       |     | 
| |       |     | h 
| |       |     | i 
| +-------------------------+     | g 
|             | h 
|             | 
+---------------------------------------------------+ 
        100% Wide 

¿Es posible hacer esto con SVG solo?

Answer 1

Si he entendido bien, esto es trivial. SVG está diseñado para tener muchos elementos visuales en una pila Z, alineados, superpuestos, lo que sea.

uso de Inkscape, libre y de código abierto, para crear IVS, y luego se puede editar el archivo directamente en un editor de texto si usted quiere ver cómo se forma SVG. En Inkscape puede usar las herramientas de alineación, la grilla, la herramienta de escala de transformación, arrastrar y soltar, y probablemente algunas otras herramientas para lograr esto.