Stroke width within viewBox

Question

I use viewBox to simulate percentage values for the path like that:

<svg width="500" height="500" viewBox="0 0 100 100">

which means that one unit has 5px. That works as expected except that the stroke is always 5px width. How can I set width of the stroke to be always 1px ? I've already tried stroke-width:1px which didn't work.

Answer 1

Use vector-effect.

<line ... stroke-width="1px" vector-effect="non-scaling-stroke" />

http://www.w3.org/TR/SVGTiny12/painting.html#NonScalingStroke