tor-browser

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

empty-span-size-001.html (1594B)


      1 <!DOCTYPE html>
      2 <html class=reftest-wait>
      3 <link rel="author" title="David Shin" href="mailto:dshin@mozilla.com">
      4 <link rel="help" href="https://drafts.csswg.org/css-inline-3/#invisible-line-boxes">
      5 <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1931466">
      6 <link rel="match" href="empty-span-size-001-ref.html">
      7 <style>
      8 .container, .has-height {
      9  border: 1px solid;
     10 }
     11 
     12 .inline {
     13  outline: 1px solid;
     14 }
     15 
     16 input {
     17  outline: 1px solid;
     18  background: transparent;
     19  padding: 0;
     20  border: 0;
     21  line-height: 10px;
     22  vertical-align: top;
     23 }
     24 
     25 .oa {
     26  overflow: hidden;
     27  height: 100px;
     28 }
     29 
     30 .filler {
     31  height: 100px;
     32  box-sizing: border-box;
     33  border: 1px solid;
     34 }
     35 
     36 .bad {
     37  background: red;
     38 }
     39 
     40 ul {
     41  margin: 0;
     42 }
     43 
     44 li {
     45  width: 0;
     46 }
     47 
     48 </style>
     49 <!-- Empty inline element in empty line has a height of zero. -->
     50 <div class="container"><span class="inline"></span></div><br>
     51 <!-- Empty inline element should not contribute to scrollable overflow. -->
     52 <div class="container oa">
     53  <div class="filler bad"></div>
     54  <span id="scrollTarget"></span>
     55  <div class="filler"></div>
     56 </div><br>
     57 <!-- ... But not if the line has a meaningful height. -->
     58 <div class="container"><span class="inline"></span><span class="has-height"></span><span class="inline"></span></div><br>
     59 <!-- ... Or if the line is present in some kind of context that gives a meaningful height. -->
     60 <div class="container"><ul><li></li><li></li></ul></div><br>
     61 <div class="container"><input type="button" value=""></div><br>
     62 <script>
     63 scrollTarget.scrollIntoView();
     64 document.documentElement.className = "";
     65 </script>
     66 </html>