tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

viewport-units-rounding-2.html (1017B)

      1 <!DOCTYPE HTML>
      2 <title>viewport units rounding test</title>
      3 <meta charset="UTF-8">
      4 <style>
      5 
      6 body > div > div { line-height: 1px }
      7 span {
      8  display: inline-block;
      9  height: 1px;
     10  width: var(--w);
     11  vertical-align: bottom;
     12 }
     13 span:nth-child(1) {
     14  background: red;
     15 }
     16 span:nth-child(2) {
     17  background: white;
     18  margin-left: var(--negw);
     19 }
     20 
     21 </style>
     22 <body>
     23 <script>
     24 
     25 for (var p = 0; p < 20; ++p) {
     26  var position = ((20 * p) + (p / 50)) + "px";
     27  var container = document.createElement("div");
     28  container.style.position = "absolute";
     29  container.style.top = "0px";
     30  container.style.left = position;
     31  for (var w = 0; w < 99; ++w) {
     32    var width = (0.5 + w / 100) + "vw";
     33    var div = document.createElement("div");
     34    div.setAttribute("style", "--w: " + width + "; " +
     35                              "--negw: -" + width);
     36    div.appendChild(document.createElement("span"));
     37    div.appendChild(document.createElement("span"));
     38    container.appendChild(div);
     39  }
     40  document.body.appendChild(container);
     41 }
     42 
     43 </script>