flex-align-content-space-around-ref.html

Enable keyboard shortcuts

<!DOCTYPE html>

<html>

<head>

    <title>CSS Flexible Box Test: align-content property - space-between</title>

    <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">

    <style type="text/css">

        .container {

            position: relative;

            height: 14em;

            width: 20em;

            background: red;

            margin: 1em;

            border: 1px solid black;

        span {

            height: 2em;

            display: inline-block;

            background: green;

            color: white;

            margin: 2.5em 1em;

            width: 8em;

            float: left;

    </style>

</head>

<body>

    <p>The test passed if you see a 2*2 table and all the cells are at the bottom of container.</p>

    <div class="container">

      <span>first</span>

      <span>second</span>

      <span>third</span>

      <span>forth</span>

    </div>

</body>

</html>