flexbox-bsize-keywords-no-stretch-1-ref.html (762B)
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>CSS Reference Case</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 align-self: start; 19 } 20 .max-content-height { 21 background: lightblue; 22 align-self: start; 23 } 24 .auto-height { 25 background: orange; 26 height: auto; 27 } 28 </style> 29 </head> 30 <body> 31 <div class="container"> 32 <div class="min-content-height">min</div> 33 <div class="max-content-height">max</div> 34 <div class="auto-height">auto</div> 35 </div> 36 </body> 37 </html>