Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(631)

Side by Side Diff: LayoutTests/fast/css-intrinsic-dimensions/intrinsic-sized-replaced-absolutes.html

Issue 1293793007: Unprefix min-content, max-content, fit-content (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: review comment Created 5 years, 4 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <style> 2 <style>
3 .container { 3 .container {
4 position:relative; 4 position:relative;
5 border: 5px solid blue; 5 border: 5px solid blue;
6 width: 350px; 6 width: 350px;
7 height: 350px; 7 height: 350px;
8 } 8 }
9 .child { 9 .child {
10 position:absolute; 10 position:absolute;
11 border: 5px solid pink; 11 border: 5px solid pink;
12 } 12 }
13 </style> 13 </style>
14 14
15 Tests that intrinsic width values on absolutely positioned element work. 15 Tests that intrinsic width values on absolutely positioned element work.
16 16
17 <!-- The 310px expected values are the 300px intrinsic width of an iframe plus 1 0px of border. 17 <!-- The 310px expected values are the 300px intrinsic width of an iframe plus 1 0px of border.
18 The 350px expected values are the iframe filling the 350px available width f rom the container. 18 The 350px expected values are the iframe filling the 350px available width f rom the container.
19 --> 19 -->
20 20
21 <!-- width tests --> 21 <!-- width tests -->
22 <div class="container"> 22 <div class="container">
23 <iframe class="child" style="width: -webkit-max-content;" data-expected-widt h="310"></iframe> 23 <iframe class="child" style="width: max-content;" data-expected-width="310"> </iframe>
24 </div> 24 </div>
25 25
26 <div class="container"> 26 <div class="container">
27 <iframe class="child" style="width: -webkit-min-content;" data-expected-widt h="310"></iframe> 27 <iframe class="child" style="width: min-content;" data-expected-width="310"> </iframe>
28 </div> 28 </div>
29 29
30 <div class="container"> 30 <div class="container">
31 <iframe class="child" style="width: -webkit-fit-content;" data-expected-widt h="310"></iframe> 31 <iframe class="child" style="width: fit-content;" data-expected-width="310"> </iframe>
32 </div> 32 </div>
33 33
34 <div class="container" style="width: 50px"> 34 <div class="container" style="width: 50px">
35 <iframe class="child" style="width: -webkit-fit-content;" data-expected-widt h="310"></iframe> 35 <iframe class="child" style="width: fit-content;" data-expected-width="310"> </iframe>
36 </div> 36 </div>
37 37
38 <div class="container"> 38 <div class="container">
39 <iframe class="child" style="width: -webkit-fill-available;" data-expected-w idth="350"></iframe> 39 <iframe class="child" style="width: -webkit-fill-available;" data-expected-w idth="350"></iframe>
40 </div> 40 </div>
41 41
42 <!-- min-width tests --> 42 <!-- min-width tests -->
43 <div class="container"> 43 <div class="container">
44 <iframe class="child" style="min-width: -webkit-max-content; width: 10px;" d ata-expected-width="310"></iframe> 44 <iframe class="child" style="min-width: max-content; width: 10px;" data-expe cted-width="310"></iframe>
45 </div> 45 </div>
46 46
47 <div class="container"> 47 <div class="container">
48 <iframe class="child" style="min-width: -webkit-min-content; width: 10px;" d ata-expected-width="310"></iframe> 48 <iframe class="child" style="min-width: min-content; width: 10px;" data-expe cted-width="310"></iframe>
49 </div> 49 </div>
50 50
51 <div class="container"> 51 <div class="container">
52 <iframe class="child" style="min-width: -webkit-fit-content; width: 10px;" d ata-expected-width="310"></iframe> 52 <iframe class="child" style="min-width: fit-content; width: 10px;" data-expe cted-width="310"></iframe>
53 </div> 53 </div>
54 54
55 <div class="container" style="width: 50px"> 55 <div class="container" style="width: 50px">
56 <iframe class="child" style="min-width: -webkit-fit-content; width: 10px;" d ata-expected-width="310"></iframe> 56 <iframe class="child" style="min-width: fit-content; width: 10px;" data-expe cted-width="310"></iframe>
57 </div> 57 </div>
58 58
59 <div class="container"> 59 <div class="container">
60 <iframe class="child" style="min-width: -webkit-fill-available; width: 10px; " data-expected-width="350"></iframe> 60 <iframe class="child" style="min-width: -webkit-fill-available; width: 10px; " data-expected-width="350"></iframe>
61 </div> 61 </div>
62 62
63 <!-- max-width tests --> 63 <!-- max-width tests -->
64 <div class="container"> 64 <div class="container">
65 <iframe class="child" style="max-width: -webkit-max-content; width: 1000px;" data-expected-width="310"></iframe> 65 <iframe class="child" style="max-width: max-content; width: 1000px;" data-ex pected-width="310"></iframe>
66 </div> 66 </div>
67 67
68 <div class="container"> 68 <div class="container">
69 <iframe class="child" style="max-width: -webkit-min-content; width: 1000px;" data-expected-width="310"></iframe> 69 <iframe class="child" style="max-width: min-content; width: 1000px;" data-ex pected-width="310"></iframe>
70 </div> 70 </div>
71 71
72 <div class="container"> 72 <div class="container">
73 <iframe class="child" style="max-width: -webkit-fit-content; width: 1000px;" data-expected-width="310"></iframe> 73 <iframe class="child" style="max-width: fit-content; width: 1000px;" data-ex pected-width="310"></iframe>
74 </div> 74 </div>
75 75
76 <div class="container" style="width: 50px"> 76 <div class="container" style="width: 50px">
77 <iframe class="child" style="max-width: -webkit-fit-content; width: 1000px;" data-expected-width="310"></iframe> 77 <iframe class="child" style="max-width: fit-content; width: 1000px;" data-ex pected-width="310"></iframe>
78 </div> 78 </div>
79 79
80 <div class="container"> 80 <div class="container">
81 <iframe class="child" style="max-width: -webkit-fill-available; width: 1000p x;" data-expected-width="350"></iframe> 81 <iframe class="child" style="max-width: -webkit-fill-available; width: 1000p x;" data-expected-width="350"></iframe>
82 </div> 82 </div>
83 83
84 <script src="../../resources/check-layout.js"></script> 84 <script src="../../resources/check-layout.js"></script>
85 <script> 85 <script>
86 checkLayout(".container"); 86 checkLayout(".container");
87 </script> 87 </script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698