flex-inline-ref.html (820B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>CSS Flexible Box Test: display proprety - inline-flex</title> 5 <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com"> 6 <style type="text/css"> 7 /* Positioned container allows for the self-describing statement to still 8 be visible in the case of failure */ 9 .container { 10 position: relative; 11 } 12 .greenSquare { 13 display: inline-block; 14 margin-top: -200px; 15 background: green; 16 } 17 </style> 18 </head> 19 <body> 20 <p>The test passed if you see a green block which its text is 'Success!'.</p> 21 <div class="container"> 22 <!-- This is the square that should not be visible if the test passes --> 23 <div class="greenSquare">Success!</div> 24 </div> 25 </body> 26 </html>