layout/reftests/svg/sizing/inline--position-absolute--02.xhtml@6474c204b198
layout/reftests/svg/sizing/inline--position-absolute--02.xhtml
Wed, 31 Dec 2014 06:09:35 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Wed, 31 Dec 2014 06:09:35 +0100
- changeset 0
- 6474c204b198
- permissions
- -rw-r--r--
Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.
1 <!--
2 Any copyright is dedicated to the Public Domain.
3 http://creativecommons.org/publicdomain/zero/1.0/
4 -->
5 <html xmlns="http://www.w3.org/1999/xhtml">
6 <head>
8 <!-- From https://bugzilla.mozilla.org/show_bug.cgi?id=342532 -->
10 <title>Test: percentage height on absolutely positioned SVG</title>
12 <!--
13 This testcase checks that percentage values for height on absolutely
14 positioned SVG will be computed relative to their containing block, and
15 not relative to the content area of the user agent.
16 -->
18 <style type="text/css">
20 html, body {
21 padding: 0;
22 border: 0;
23 margin: 0;
24 height: 100%;
25 background: lime;
26 }
28 </style>
29 </head>
30 <body>
32 <!-- create containing block for absolutely positioned children -->
33 <div style="position:relative;">
35 <!-- div to expand parent div to a computed height of 20px -->
36 <div style="height:20px; background:red;"/>
38 <!-- absolutely positioned SVG - the explicit 100% percentage height
39 should compute as a percentage of the parent div's computed height,
40 not as a percentage of the body's height! I.e. no red should show.
41 -->
42 <svg xmlns="http://www.w3.org/2000/svg" style="position:absolute; top:0; width: 100%; height: 100%">
43 <rect width="100%" height="100%" fill="red"/>
44 <rect width="100%" height="20px" fill="lime"/>
45 </svg>
47 </div>
49 </body>
50 </html>
