third_party/WebKit/LayoutTests/css3/flexbox/flex-one-sets-flex-basis-to-zero-px.html

   1 <!DOCTYPE html>
   2 <html>
   3 <link href="resources/flexbox.css" rel="stylesheet">
   4 <style>
   5 .flexbox > div {
   6     font-family: Ahem;
   7     font-size: 14px;
   8 }
   9
  10 .flex-one-one-zero-percent {
  11     flex: 1 1 0%;
  12     min-width: 0;
  13     min-height: 0;
  14 }
  15
  16 .flex-one-one-zero-px {
  17     flex: 1 1 0px;
  18     min-width: 0;
  19     min-height: 0;
  20 }
  21
  22 .vertical {
  23     -webkit-writing-mode: vertical-rl;
  24 }
  25 </style>
  26 <script src="../../resources/check-layout.js"></script>
  27 <script src="../../resources/ahem.js"></script>
  28 <body onload="checkLayout('.flexbox');">
  29 <div class="flexbox column">
  30   <div class="flex-one" data-expected-height="14">Flex item with flex: 1</div>
  31 </div>
  32
  33 <div class="flexbox column">
  34   <div class="flex-one-one-zero-percent" data-expected-height="14">Flex item with flex: 1 1 0%</div>
  35 </div>
  36
  37 <div class="flexbox column">
  38   <div class="flex-one-one-zero-px" data-expected-height="0">Flex item with flex: 1 1 0px</div>
  39 </div>
  40
  41 <div class="flexbox column vertical">
  42   <div class="flex-one" data-expected-width="14">Flex item with flex: 1</div>
  43 </div>
  44
  45 <div class="flexbox column vertical">
  46   <div class="flex-one-one-zero-percent" data-expected-width="14">Flex item with flex: 1 1 0%</div>
  47 </div>
  48
  49 <div class="flexbox column vertical">
  50   <div class="flex-one-one-zero-px" data-expected-width="0">Flex item with flex: 1 1 0px</div>
  51 </div>
  52 </body>
  53 </html>