svg - "vector-effect" when set to non-scaling-stroke but scaled in parent div -



svg - "vector-effect" when set to non-scaling-stroke but scaled in parent div -

i want maintain stroke width of svg if parent scaled.

i trying code below;

<svg version="1.2" baseprofile="tiny" viewbox="-100 -100 200 200"> <rect vector-effect="non-scaling-stroke" x="-20" y="-20" width="40" height="40" rx="5" ry="5" stroke="red" stroke-width="2" fill="none"></rect> </svg>

and above works great, want below;

<div style="-webkit-transform: scale(5,5);"> <svg version="1.2" baseprofile="tiny" viewbox="-100 -100 200 200"> <rect vector-effect="non-scaling-stroke" x="-20" y="-20" width="40" height="40" rx="5" ry="5" stroke="red" stroke-width="2" fill="none"></rect> </svg> </div>

so if parent dive scaled 5, output of stroke scaled 5. want maintain stroke width of rect fixed size of 2 parent div scaled. may help?

svg webkit scaletransform

Comments

Popular posts from this blog

model view controller - MVC Rails Planning -

ruby on rails - Devise Logout Error in RoR -

html - Submenu setup with jquery and effect 'fold' -