| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647 |
- <rml>
- <head>
- <title>Flex nested ref</title>
- <link type="text/rcss" href="../../style.rcss"/>
- <meta name="Reference" content="Reference implemented by wrapping the nested flex box in an extra div." />
- <style>
- #window {
- display: flex;
- width: 100%;
- height: 100%;
- overflow: hidden auto;
- flex-direction: row;
- justify-content: center;
- flex-wrap: nowrap;
- }
- .column {
- width: 40%;
- }
- .content {
- display: flex;
- height: 128px;
- text-align: center;
- flex-direction: row;
- }
- </style>
- </head>
- <body>
- <div id="window">
- <div class="column">
- <div class="content">
- <div style="width: 20%; background: red;">1</div>
- <div style="width: 60%; background: green;">2</div>
- <div style="width: 20%; background: blue;">3</div>
- </div>
- </div>
- <div class="column">
- <div class="content">
- <div style="width: 20%; background: red;">1</div>
- <div style="width: 60%; background: green;">2</div>
- <div style="width: 20%; background: blue;">3</div>
- </div>
- </div>
- </div>
- <handle size_target="#document"/>
- </body>
- </rml>
|