OLD | NEW |
---|---|
(Empty) | |
1 <!DOCTYPE html> | |
2 <style> | |
3 #container { | |
4 display: inline-block; | |
5 height: 100%; | |
6 } | |
7 #middle { | |
8 height: 100%; | |
9 } | |
10 #stylefloat { | |
11 height: 100%; | |
12 float: left; | |
13 } | |
14 img { | |
15 display: block; | |
16 min-height: 100%; | |
17 } | |
18 </style> | |
19 | |
20 <p> | |
21 Tests that recalculate block width when parent changes height | |
22 when it has relative height and width auto. | |
23 </p> | |
24 | |
25 <div style="height:100px"> | |
26 <div id="parent1" style="height:100px"> | |
27 <div id="container" data-expected-width=25> | |
28 <img src='data:image/svg+xml;utf8,<svg height="2px" width="1px" xmlns="htt p://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1 "></svg>'></img> | |
mstensho (USE GERRIT)
2017/04/25 07:52:51
IMG doesn't need an end tag.
| |
29 </div> | |
30 </div> | |
31 </div> | |
32 | |
33 <div id="parent2" style="height:100px;"> | |
34 <div id="stylefloat" data-expected-width=25> | |
35 <div id="middle" data-expected-width=25> | |
36 <img src='data:image/svg+xml;utf8,<svg height="2px" width="1px" xmlns="htt p://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1 "></svg>'></img> | |
mstensho (USE GERRIT)
2017/04/25 07:52:50
Ditto.
| |
37 </div> | |
38 </div> | |
39 </div> | |
40 | |
41 <div id="results"></div> | |
42 | |
43 <script src="../../resources/testharness.js"></script> | |
44 <script src="../../resources/testharnessreport.js"></script> | |
45 <script src="../../resources/check-layout-th.js"></script> | |
46 <script> | |
47 document.body.offsetTop; | |
48 document.getElementById("parent1").style.height = "50px"; | |
49 checkLayout("#container", results); | |
50 | |
51 document.body.offsetTop; | |
52 document.getElementById("parent2").style.height = "50px"; | |
53 checkLayout("#stylefloat", results); | |
54 checkLayout("#middle", results); | |
mstensho (USE GERRIT)
2017/04/25 07:52:51
You can omit this. checkLayout() processes the ent
| |
55 </script> | |
OLD | NEW |