flexbox-inlinecontent-horiz-1a.xhtml (916B)
1 <?xml version="1.0" encoding="UTF-8"?> 2 <!-- 3 Any copyright is dedicated to the Public Domain. 4 http://creativecommons.org/publicdomain/zero/1.0/ 5 --> 6 <!-- 7 This test has static inline content intermixed with flex items, 8 inside a flex container. 9 --> 10 <html xmlns="http://www.w3.org/1999/xhtml"> 11 <head> 12 <link rel="stylesheet" type="text/css" href="ahem.css" /> 13 <style> 14 div { height: 100px; } 15 div.flexbox { 16 font: 10px Ahem; 17 width: 200px; 18 display: flex; 19 } 20 div.a { 21 flex: 1 0 20px; 22 background: lightgreen; 23 } 24 div.b { 25 flex: 2 0 30px; 26 background: yellow; 27 } 28 div.inflex { 29 flex: 0 0 20px; 30 background: gray; 31 } 32 </style> 33 </head> 34 <body> 35 <div class="flexbox" 36 ><div class="a"/>text<div class="b"/><i>italic</i 37 ><div class="inflex"/></div> 38 </body> 39 </html>