tor-browser

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

block-container-block-end-with-self-collapsing-children.html (2571B)


      1 <!DOCTYPE html>
      2 <html>
      3 <head>
      4 <link rel="author" href="mailto:sammy.gill@apple.com">
      5 <link rel="help" href="https://drafts.csswg.org/css-box-4/#margin-trim-block">
      6 <meta name="assert" content="Second item and all self-collapsing children at block-end should have margins trimmed">
      7 <style>
      8 container {
      9    display: block;
     10    inline-size: min-content;
     11    margin-trim: block-end;
     12 }
     13 item {
     14    display: block;
     15    background-color: green;
     16    inline-size: 50px;
     17    block-size: 50px;
     18    margin-block-end: 10px;
     19 }
     20 .collapsed {
     21    block-size: 0px;
     22 }
     23 </style>
     24 <script src="/resources/testharness.js"></script>
     25 <script src="/resources/testharnessreport.js"></script>
     26 <script src="/resources/check-layout-th.js"></script>
     27 </head>
     28 <body onload="checkLayout('item')">
     29    <div id="target">
     30        <container>
     31            <item data-expected-margin-bottom="10"></item>
     32            <item data-expected-margin-bottom="0"></item>
     33            <item class="collapsed" data-expected-margin-bottom="0">
     34                <div><item class="collapsed" data-expected-margin-bottom="0">
     35                    <div><item class="collapsed" data-expected-margin-bottom="0">
     36                        <div><item class="collapsed" data-expected-margin-bottom="0"></item></div>
     37                        <div><item class="collapsed" data-expected-margin-bottom="0"></item></div>
     38                    </item></div>
     39                </item></div>
     40                <div><item class="collapsed" data-expected-margin-bottom="0"></item></div>
     41            </item>
     42            <item class="collapsed" data-expected-margin-bottom="0">
     43                <div><item class="collapsed" data-expected-margin-bottom="0">
     44                    <div><item class="collapsed" data-expected-margin-bottom="0"></item></div>
     45                    <div><item class="collapsed" data-expected-margin-bottom="0">
     46                        <div><item class="collapsed" data-expected-margin-bottom="0"></item></div>
     47                    </item></div>
     48                    <div><item class="collapsed" data-expected-margin-bottom="0"></item></div>
     49                </item></div>
     50                <div><item class="collapsed" data-expected-margin-bottom="0">
     51                    <div><item class="collapsed" data-expected-margin-bottom="0">
     52                        <div><item class="collapsed" data-expected-margin-bottom="0"></item></div>
     53                    </item></div>
     54                </item></div>
     55            </item>
     56            <item class="collapsed" data-expected-margin-bottom="0"></item>
     57        </container>
     58    </div>
     59 </body>
     60 </html>