<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>CSS Flexible Box Test: Minimum width of flex items</title> <link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com"> <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#min-size-auto" title="4.5. Implied Minimum Size of Flex Items"> <link rel="match" href="reference/ref-filled-green-100px-square.htm"> <meta name="assert" content="Checks that minimum width for flex items is the transferred size, as the min-content size of the image corresponds to that."> <style type="text/css"> #reference-overlapped-red { position: absolute; background-color: red; width: 100px; height: 100px; z-index: -1; } #constrained-flex { display: flex; width: 10px; } #test-flex-item-overlapping-green { height: 100px; } </style> </head> <body> <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> <div id="reference-overlapped-red"></div> <div id="constrained-flex"> <img id="test-flex-item-overlapping-green" src="support/200x200-green.png"> </div> </body> </html>