Insert text between a rectangle drawn in SVG
14,456
I am not sure what you mean by "between". If you mean "centered horizontally and vertically", then this would do it:
<svg width="100%" height="100%" version="1.1" xmlns="http://www.w3.org/2000/svg">
<rect x="20" y="20" width="250" height="250" style="fill:blue" />
<text x="145" y="145" text-anchor="middle" alignment-baseline="middle">
Hello World
</text>
</svg>
Did you mean something else?
If you are talking about having text filling the rectangle—multiple lines of text wrapping at the edges of the rectangle onto a new line—then you should see this Stack Overflow question instead.
Related videos on Youtube
Author by
Maverick
Updated on September 29, 2020Comments
-
Maverick over 3 years
I have a code in SVG:
<svg width="100%" height="100%" version="1.1"xmlns="http://www.w3.org/2000/svg"> <rect x="20" y="20" width="250" height="250" style="fill:blue"> <animate attributeType="CSS" attributeName="opacity" from="1" to="0" dur="5s" repeatCount="indefinite" /> </rect> </svg>
Now I need to add a text between this
rectangle
. Can anyone tell me how to do it?-
Phrogz about 13 yearsI assume the lack of a space between your
version
andxmlns
attributes is a typo just in your posting? -
Phrogz about 13 yearsPossible duplicate of Auto line-wrapping in SVG text.
-