| <!-- |
| Any copyright is dedicated to the Public Domain. |
| http://creativecommons.org/publicdomain/zero/1.0/ |
| --> |
| <svg xmlns="http://www.w3.org/2000/svg"> |
| <title>Vector image without intrinsic dimensions with percentage stroke-width (proportional to the diagonal)</title> |
| <rect y="0" width="100%" height="50%" fill="lime"/> |
| <rect y="50%" width="100%" height="50%" fill="aqua"/> |
| <!-- |
| A percent stroke-width is resolved with respect to: |
| |
| d = sqrt(vh**2 + vw**2) / sqrt(2) |
| |
| where vh/vw are the image viewport width/height. Because this image has no |
| intrinsic dimensions or ratio, it expands to fill the entire background |
| positioning area, so its width is 100px and its height is 700px. For those |
| carefully-chosen dimensions, d = 500px, so 10% of that creates a 50px-wide |
| rectangle, vertically centered and horizontally left-aligned in the image. |
| --> |
| <line x1="25%" y1="25%" x2="25%" y2="75%" stroke="fuchsia" stroke-width="10%"/> |
| </svg> |
