third_party/WebKit/LayoutTests/fast/css-intrinsic-dimensions/max-width-unconstrained.html

   1 <!doctype html>
   2 <!--
   3     Tests the behavior of the intrinsic width keywords when applied to max-width
   4     by placing them in an uncontrained container (the body). This test passes if
   5     min-content is the smallest, max-content and fit-content are shrink wrapped
   6     like floats and fill-avaialble is the full width of the body.
   7 -->
   8 <style>
   9     @import "resources/width-keyword-classes.css";
  10
  11     body * {
  12         border: 5px solid red;
  13         padding: 5px;
  14     }
  15
  16     span {
  17         display: inline-block;
  18         width: 200px;
  19         border-color: green;
  20     }
  21 </style>
  22
  23 <div class="max-width-min-content">
  24     <span>Min Content</span> on this box.
  25 </div>
  26
  27 <div class="max-width-max-content">
  28     <span>Max Content</span> on this box.
  29 </div>
  30
  31 <div class="max-width-fill-available">
  32     <span>Fill Available</span> on this box.
  33 </div>
  34
  35 <div class="max-width-fit-content">
  36     <span>Fit Content</span> on this box.
  37 </div>