layout/reftests/text/hyphenation-control-6-ref.html

   1 <!DOCTYPE html>
   2 <html lang="en">
   3 <meta charset="utf-8">
   4 <style>
   5 .test { hyphens:auto; font:10px Ubuntu Mono, Courier New, Courier, monospace; border: 1px solid silver; }
   6 </style>
   7 <body>
   8 <p>All the columns should appear identical:</p>
   9 <div id="outer" style="columns:6">
  10 <script>
  11 let outer = document.getElementById("outer");
  12 for (i = 1; i <= 6; ++i) {
  13   div = document.createElement("div");
  14   div.className = "test";
  15   div.style.width = "0ch";
  16   div.innerHTML = "the<br>flow-<br>rel-<br>a-<br>tive";
  17   outer.appendChild(div);
  18
  19   div = document.createElement("div");
  20   div.className = "test";
  21   div.style.width = "2ch";
  22   div.innerHTML = "the<br>flow-<br>rel-<br>a-<br>tive";
  23   outer.appendChild(div);
  24
  25   div = document.createElement("div");
  26   div.className = "test";
  27   div.style.width = "4ch";
  28   div.innerHTML = "the<br>flow-<br>rel-<br>a-<br>tive";
  29   outer.appendChild(div);
  30
  31   div = document.createElement("div");
  32   div.className = "test";
  33   div.style.width = "6ch";
  34   div.innerHTML = "the<br>flow-<br>rela-<br>tive";
  35   outer.appendChild(div);
  36
  37   div = document.createElement("div");
  38   div.className = "test";
  39   div.style.width = "8ch";
  40   div.innerHTML = "the<br>flow-<br>relative";
  41   outer.appendChild(div);
  42
  43   div = document.createElement("div");
  44   div.className = "test";
  45   div.style.width = "10ch";
  46   div.innerHTML = "the flow-<br>relative";
  47   outer.appendChild(div);
  48
  49   div = document.createElement("div");
  50   div.className = "test";
  51   div.style.width = "12ch";
  52   div.innerHTML = "the flow-<br>relative";
  53   outer.appendChild(div);
  54
  55   div = document.createElement("div");
  56   div.className = "test";
  57   div.style.width = "14ch";
  58   div.innerHTML = "the flow-<br>relative";
  59   outer.appendChild(div);
  60
  61   div = document.createElement("div");
  62   div.className = "test";
  63   div.style.width = "16ch";
  64   div.innerHTML = "the flow-<br>relative";
  65   outer.appendChild(div);
  66
  67   div = document.createElement("div");
  68   div.className = "test";
  69   div.style.width = "18ch";
  70   div.innerHTML = "the flow-relative";
  71   outer.appendChild(div);
  72 }
  73 </script>