flexbox-bsize-keywords-no-stretch-1.html (932B)
1 <!DOCTYPE html> 2 <!-- 3 Any copyright is dedicated to the Public Domain. 4 http://creativecommons.org/publicdomain/zero/1.0/ 5 --> 6 <html> 7 <head> 8 <title>Testing that the (default) 'align-items:stretch' only stretches flex items with height:auto (not height:[other-keyword])</title> 9 <meta charset="utf-8"> 10 <style> 11 .container { 12 display: flex; 13 height: 100px; 14 border: 1px solid black; 15 } 16 .min-content-height { 17 background: pink; 18 height: -moz-min-content; 19 height: min-content; 20 } 21 .max-content-height { 22 background: lightblue; 23 height: -moz-max-content; 24 height: max-content; 25 } 26 .auto-height { 27 background: orange; 28 height: auto; 29 } 30 </style> 31 </head> 32 <body> 33 <div class="container"> 34 <div class="min-content-height">min</div> 35 <div class="max-content-height">max</div> 36 <div class="auto-height">auto</div> 37 </div> 38 </body> 39 </html>