layout/reftests/svg/sizing/inline--position-absolute--02.xhtml@925c144e1f1f
layout/reftests/svg/sizing/inline--position-absolute--02.xhtml
Fri, 16 Jan 2015 18:13:44 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Fri, 16 Jan 2015 18:13:44 +0100
- branch
- TOR_BUG_9701
- changeset 14
- 925c144e1f1f
- permissions
- -rw-r--r--
Integrate suggestion from review to improve consistency with existing code.
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>
