flexbox-float-1b.xhtml (1116B)
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 is like flexbox-float-1a.xhtml, but with the float-styled 8 element already being a block. (Should render the same.) 9 --> 10 <html xmlns="http://www.w3.org/1999/xhtml"> 11 <head> 12 <style> 13 div.flexbox { 14 display: flex; 15 width: 400px; 16 margin-bottom: 2px; 17 font-family: sans-serif; 18 background: lightgreen; 19 justify-content: space-around; 20 } 21 </style> 22 </head> 23 <body> 24 <div class="flexbox"> 25 aaa<div style="float: left">[[[</div>bbb 26 </div> 27 <div class="flexbox"> 28 aaa<div style="float: right">]]]</div>bbb 29 </div> 30 <div class="flexbox"> 31 aaa<div style="float: left">[[[</div> 32 </div> 33 <div class="flexbox"> 34 aaa<div style="float: right">]]]</div> 35 </div> 36 <div class="flexbox"> 37 <div style="float: left">[[[</div>bbb 38 </div> 39 <div class="flexbox"> 40 <div style="float: right">]]]</div>bbb 41 </div> 42 </body> 43 </html>