| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647 |
- <!DOCTYPE html>
- <!--
- Any copyright is dedicated to the Public Domain.
- http://creativecommons.org/publicdomain/zero/1.0/
- -->
- <!--
- This testcase checks that, for any widgets that have a single valid size
- (and hence refuse to flex), we don't stretch them in the cross-axis,
- despite the "align-self: stretch" property.
- These widgets can be allowed to be resized on some platforms but not others.
- We'll account for that by giving them height: 100% in the reference case,
- so that if they're allowed to stretch, then they'll stretch in both the
- reference case and the testcase.
- -->
- <html>
- <head>
- <style>
- div.flexbox {
- display: flex;
- background: lightgray;
- float: left;
- height: 60px;
- margin-right: 10px;
- }
- div.flexbox > * {
- outline: 1px dashed black;
- margin: 0;
- vertical-align: top;
- height: auto;
- align-self: stretch;
- }
- br { clear: left; }
- </style>
- </head>
- <body>
- <div class="flexbox"><input type="button"></div>
- <div class="flexbox"><input type="checkbox"></div>
- <br>
- <div class="flexbox"><input type="image"></div>
- <div class="flexbox"><input type="radio"></div>
- <br>
- <div class="flexbox"><input type="reset"></div>
- <div class="flexbox"><input type="submit"></div>
- </body>
- </html>
|
