LayoutTests/fast/css-intrinsic-dimensions/max-width-constrained.html - WebKit - Git at Google

 <!doctype html>
 <!--
     Tests the behavior of the intrinsic width keywords when applied to max-width
     by placing them inside a constrained container. This test passes if all
     blocks are constrained inside the container since all intrinsic widths
     should be too large to fit.
 -->
 <style>
     @import "resources/width-keyword-classes.css";

     body * {
         border: 5px solid red;
         padding: 5px;
     }

     span {
         display: inline-block;
         width: 200px;
         border-color: green;
     }

     #container {
         width: 150px;
     }
 </style>

 <div id="container">

     <div class="max-width-min-content">
         <span>Min Content</span> on this box.
     </div>

     <div class="max-width-max-content">
         <span>Max Content</span> on this box.
     </div>

     <div class="max-width-fill-available">
         <span>Fill Available</span> on this box.
     </div>

     <div class="max-width-fit-content">
         <span>Fit Content</span> on this box.
     </div>

 </div>
	<!doctype html>
	<!--
	Tests the behavior of the intrinsic width keywords when applied to max-width
	by placing them inside a constrained container. This test passes if all
	blocks are constrained inside the container since all intrinsic widths
	should be too large to fit.
	-->
	<style>
	@import "resources/width-keyword-classes.css";

	body * {
	border: 5px solid red;
	padding: 5px;
	}

	span {
	display: inline-block;
	width: 200px;
	border-color: green;
	}

	#container {
	width: 150px;
	}
	</style>

	<div id="container">

	<div class="max-width-min-content">
	<span>Min Content</span> on this box.
	</div>

	<div class="max-width-max-content">
	<span>Max Content</span> on this box.
	</div>

	<div class="max-width-fill-available">
	<span>Fill Available</span> on this box.
	</div>

	<div class="max-width-fit-content">
	<span>Fit Content</span> on this box.
	</div>

	</div>