third_party/WebKit/LayoutTests/fast/multicol/overflow-content.html

   1 <style>
   2     div.test {
   3         -webkit-logical-width: 100px;
   4         -webkit-border-before: 5px solid;
   5         -webkit-border-after: 15px solid;
   6         -webkit-column-count: 2;
   7         -webkit-column-gap: 0;
   8         column-count: 2;
   9         column-gap: 0;
  10         column-fill: auto;
  11         background-color: lightblue;
  12     }
  13     div.container {
  14         -webkit-logical-height: 120px;
  15         background-color: red;
  16         -webkit-logical-width: 100px;
  17         -webkit-margin-after: 8px;
  18     }
  19 </style>
  20 <div>
  21     <div class="container">
  22         <div class="test" style="-webkit-logical-height: 100px;">
  23             <div style="-webkit-logical-height: 20px;">
  24                 <div style="-webkit-logical-height: 300px; background-color: yellow;"></div>
  25             </div>
  26         </div>
  27     </div>
  28
  29     <div class="container">
  30         <div class="test">
  31             <div style="-webkit-logical-height: 20px;">
  32                 <div style="-webkit-logical-height: 200px; background-color: yellow;"></div>
  33             </div>
  34         </div>
  35     </div>
  36
  37     <div class="container">
  38         <div class="test">
  39             <div style="-webkit-logical-height: 10px;"></div>
  40             <div style="-webkit-column-break-before: always; -webkit-logical-height: 10px;">
  41                 <div style="-webkit-logical-height: 100px; background-color: yellow;"></div>
  42             </div>
  43             <div style="-webkit-logical-height: 20px;"></div>
  44         </div>
  45     </div>
  46 </div>
  47 <div style="-webkit-writing-mode: vertical-rl;">
  48     <div class="container">
  49         <div class="test" style="-webkit-logical-height: 100px;">
  50             <div style="-webkit-logical-height: 20px;">
  51                 <div style="-webkit-logical-height: 300px; background-color: yellow;"></div>
  52             </div>
  53         </div>
  54     </div>
  55
  56     <div class="container">
  57         <div class="test">
  58             <div style="-webkit-logical-height: 20px;">
  59                 <div style="-webkit-logical-height: 200px; background-color: yellow;"></div>
  60             </div>
  61         </div>
  62     </div>
  63
  64     <div class="container">
  65         <div class="test">
  66             <div style="-webkit-logical-height: 10px;"></div>
  67             <div style="-webkit-column-break-before: always; -webkit-logical-height: 10px;">
  68                 <div style="-webkit-logical-height: 100px; background-color: yellow;"></div>
  69             </div>
  70             <div style="-webkit-logical-height: 20px;"></div>
  71         </div>
  72     </div>
  73 </div>