CodingForums.com - View Single Post

johnsmith153 · 11-14-2012, 08:28 AM

Hi,

Thanks for replying.

It seems my setup is a little confusing and this is the first time I have looked at <svg>. Basically the red box must be 30% width and the height should not be set so it just wraps around the contents.

The settings on the SVG are not set in stone. For the example, I really just want this part:

Code:

<polygon points="220,10 300,210 170,250 123,234" style="fill:lime;stroke:purple;stroke-width:1"></polygon>

...to be displayed central in the red box.

The idea is to understand how all this works so I can display any <svg> code, but doing so inside the 30% red box div doesn't seem easy.

So, really I want this:
http://page-test.co.uk/image.html
...but instead of using the <img> tag to display the bitmap I want to display the green shape with <svg>.

If my view box is smaller than the SVG image itself then this is just from my poor attempt to get this working.

Hope this helps. Thanks for helping.

11-14-2012, 08:28 AM	PM User \| #3
johnsmith153 New Coder Join Date: Mar 2012 Posts: 81 Thanks: 7 Thanked 0 Times in 0 Posts	Hi, Thanks for replying. It seems my setup is a little confusing and this is the first time I have looked at <svg>. Basically the red box must be 30% width and the height should not be set so it just wraps around the contents. The settings on the SVG are not set in stone. For the example, I really just want this part: Code: <polygon points="220,10 300,210 170,250 123,234" style="fill:lime;stroke:purple;stroke-width:1"></polygon> ...to be displayed central in the red box. The idea is to understand how all this works so I can display any <svg> code, but doing so inside the 30% red box div doesn't seem easy. So, really I want this: http://page-test.co.uk/image.html ...but instead of using the <img> tag to display the bitmap I want to display the green shape with <svg>. If my view box is smaller than the SVG image itself then this is just from my poor attempt to get this working. Hope this helps. Thanks for helping.