tor-browser

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

baseline-block-with-overflow-001.html (1269B)


      1 <!DOCTYPE html>
      2 <title>CSS Test: Baseline of blocks with `overflow: hidden`</title>
      3 <link rel="match" href="baseline-block-with-overflow-001-ref.html">
      4 <link rel="help" href="https://drafts.csswg.org/css2/visudet.html#propdef-vertical-align">
      5 <link rel="author" title="Koji Ishii" href="mailto:kojii@chromium.org">
      6 <style>
      7 section {
      8  margin-bottom: 1px;
      9 }
     10 .outer {
     11  display: inline-block;
     12  background: orange;
     13  padding-bottom: 20px;
     14 }
     15 .inner {
     16  width: 30px;
     17  height: 30px;
     18  overflow: hidden;
     19  background: blue;
     20 }
     21 .inline-block {
     22  display: inline-block;
     23 }
     24 .margin-bottom {
     25  margin-bottom: 30px;
     26 }
     27 </style>
     28 <body>
     29  <section>
     30    <div class="outer">
     31      <div class="inner inline-block">
     32      </div>
     33    </div>
     34    XX
     35  </section>
     36  <section>
     37    <div class="outer">
     38      <div class="inner">
     39      </div>
     40    </div>
     41    XX
     42  </section>
     43  <section>
     44    <div class="outer">
     45      <div class="inner">
     46        XX
     47      </div>
     48    </div>
     49    XX
     50  </section>
     51  <section>
     52    <div class="outer">
     53      <div class="inner margin-bottom inline-block">
     54        XX
     55      </div>
     56    </div>
     57    XX
     58  </section>
     59  <section class="margin-bottom">
     60    <div class="outer">
     61      <div class="inner margin-bottom">
     62        XX
     63      </div>
     64    </div>
     65    XX
     66  </section>
     67 </body>