src/third_party/WebKit/LayoutTests/fast/sub-pixel/flexbox-unnecessary-scrollbar.html

   1 <!DOCTYPE html>
   2 <html>
   3     <head>
   4         <title>Scrollbar overflow test</title>
   5         <style>
   6           body { width: 333px; }
   7
   8           #grid {
   9             overflow-y: scroll;
  10             flex: 1;
  11             display: flex;
  12           }
  13
  14           #grid::-webkit-scrollbar {
  15             height: 10px;
  16             width: 10px;
  17           }
  18
  19           #grid::-webkit-scrollbar-thumb {
  20             background-color: red;
  21             border-width: 4px;
  22           }
  23
  24           #rows {
  25             flex: 1;
  26             height: 100%;
  27             position: relative;
  28           }
  29
  30           .row {
  31             background: blue;
  32             height: 50px;
  33           }
  34
  35           #cols {
  36             display: flex;
  37             position: absolute;
  38             top: 0;
  39             left: 0;
  40             right: 0;
  41             bottom: 0;
  42           }
  43
  44           .col {
  45             flex: 1;
  46           }
  47         </style>
  48     </head>
  49     <body>
  50       <div id="grid">
  51         <div id="rows">
  52           <div class="row"></div>
  53           <div id="cols">
  54             <div class="col"></div>
  55             <div class="col"></div>
  56             <div class="col"></div>
  57           </div>
  58         </div>
  59       </div>
  60       <p>
  61         Tests that subpixel accumulation works for flexbox and that
  62         scrollbars do not show unnecessarily. No red should show up above.
  63       </p>
  64   </body>
  65 <html>