[Text Autosizing] Combine narrow descendants of a cluster into groups that should...
[WebKit-https.git] / LayoutTests / fast / text-autosizing / narrow-descendants-combined.html
1 <!DOCTYPE html>
2 <html>
3 <head>
4
5 <meta name="viewport" content="width=800">
6 <style>
7 html { font-size: 16px; }
8 body { width: 800px; margin: 0; overflow-y: hidden; }
9 </style>
10
11 <script>
12 if (window.internals) {
13     window.internals.settings.setTextAutosizingEnabled(true);
14     window.internals.settings.setTextAutosizingWindowSizeOverride(320, 480);
15 } else if (window.console && console.warn) {
16     console.warn("This test depends on the Text Autosizing setting being true, so run it in DumpRenderTree, or manually enable Text Autosizing, and either use a mobile device with 320px device-width (like Nexus S or iPhone), or define HACK_FORCE_TEXT_AUTOSIZING_ON_DESKTOP.");
17 }
18 </script>
19
20 </head>
21 <body>
22
23 <div>
24     <div style="width: 240px">
25         This text should be autosized to 20px computed font-size as it is combined with the next and the last narrow siblings and the maximum width is 400px.
26     </div>
27     <div style="width: 320px">
28         This text should be autosized to 20px computed font-size as it is combined with the first and the last narrow siblings and the maximum width is 400px.
29     </div>
30     <div style="width: 560px">
31         This text should be autosized to 28px computed font-size as it is combined into a separate group from its two siblings since it's significantly wider.<br>
32         Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
33     </div>
34     <div style="width: 400px">
35         This text should be autosized to 20px computed font-size as it is combined with the first and the second narrow siblings and the maximum width is 400px.<br>
36         Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
37     </div>
38 </div>
39
40 </body>
41 </html>