blob: 391a9abe84b3dc4f65b3fceeb92208c6ac9b5241 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
|
<!--
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>
|
