svg - overflow visible

Question

I am trying to create an svg containing circles. The size of each circle can change overtime and sometimes it gets bigger than my svg so I'd like to make the overflow visible but somehow it is not working:

HTML:

<svg class="container1" width="100px">
    <a class="g-node" xlink:href="#test" transform="translate(445,194)" stroke="black">
        <circle r="16.246572566634875" fill="red"></circle>
    </a>
</svg>

CSS:

.container1{
    overflow: visible !important;
}

JSFiddle: http://jsfiddle.net/LuwWa/

Is there any way to make the overflow visible?

thanks

Where do you want to paint a circle when there is no paper (container)? — ratmalwer, May 12 '14 at 21:15

score 0 · Answer 1 · answered May 12 '14 at 22:36

0

The problem is that your CSS selector is .container but your svg elements have classes container1 and container2.

Demo

answered May 12 '14 at 22:36

Oriol

274,082
63
437
513

svg - overflow visible

1 Answers1