layout/reftests/svg/sizing/inline--position-absolute--02.xhtml@8bccb770b82d
layout/reftests/svg/sizing/inline--position-absolute--02.xhtml
Wed, 31 Dec 2014 13:27:57 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Wed, 31 Dec 2014 13:27:57 +0100
- branch
- TOR_BUG_3246
- changeset 6
- 8bccb770b82d
- permissions
- -rw-r--r--
Ignore runtime configuration files generated during quality assurance.
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>
