flexbox_fbfc-ref.html (531B)
1 <!DOCTYPE html> 2 <title>flexbox | flex formatting context :: float intrusion</title> 3 <link rel="author" href="http://opera.com" title="Opera Software"> 4 <style> 5 * {margin: 0;} 6 body {width: 600px;} 7 #float { 8 background: #3366cc; 9 width: 25%; 10 float: left; 11 } 12 #flex { 13 background: #ffcc00; 14 padding: 2em 0; 15 width: 80%; 16 clear: both; 17 } 18 div div { 19 background: pink; 20 margin: 0 2em; 21 height: 4em; 22 display: inline-block; 23 } 24 </style> 25 26 <div id="float">filler</div> 27 28 <div id="flex"> 29 <div>Yellow box should be below the blue box</div> 30 </div>