| 123456789101112131415161718192021222324252627282930313233343536373839 |
- <!DOCTYPE html>
- <!--
- Any copyright is dedicated to the Public Domain.
- http://creativecommons.org/publicdomain/zero/1.0/
- -->
- <html>
- <head>
- <title>CSS Test: Testing a horizontal flex container with box-sizing:border-box</title>
- <link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com">
- <meta charset="utf-8">
- <style>
- .container {
- display: flex;
- flex-direction: column;
- width: 30px;
- height: 110px;
- border: 5px solid black;
- box-sizing: border-box;
- }
- .itemA {
- flex: 1 28px;
- background: purple;
- border: 1px solid indigo;
- }
- .itemB {
- flex: 1 48px;
- background: teal;
- border: 1px solid lightblue;
- }
- </style>
- </head>
- <body>
- <div class="container">
- <div class="itemA"></div>
- <div class="itemB"></div>
- </div>
- </body>
- </html>
|
