blob: a9f7a2b7ed481cac2af90caf125c34c23ea53684 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
|
<!--
Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/
-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!-- From https://bugzilla.mozilla.org/show_bug.cgi?id=342532 -->
<title>Test: percentage height on absolutely positioned SVG</title>
<!--
This testcase checks that percentage values for height on absolutely
positioned SVG will be computed relative to their containing block, and
not relative to the content area of the user agent.
-->
<style type="text/css">
html, body {
padding: 0;
border: 0;
margin: 0;
height: 100%;
background: lime;
}
</style>
</head>
<body>
<!-- create containing block for absolutely positioned children -->
<div style="position:relative;">
<!-- div to expand parent div to a computed height of 20px -->
<div style="height:20px; background:red;"/>
<!-- absolutely positioned SVG - the explicit 100% percentage height
should compute as a percentage of the parent div's computed height,
not as a percentage of the body's height! I.e. no red should show.
-->
<svg xmlns="http://www.w3.org/2000/svg" style="position:absolute; top:0; width: 100%; height: 100%">
<rect width="100%" height="100%" fill="red"/>
<rect width="100%" height="20px" fill="lime"/>
</svg>
</div>
</body>
</html>
|
