| OLD | NEW |
|---|
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <script src="resources/scrollbars.js"></script> | 2 <script src="resources/scrollbars.js"></script> |
| 3 <style> | 3 <style> |
| 4 .horizontal-header { | 4 .horizontal-header { |
| 5 width: 120px; | 5 width: 120px; |
| 6 } | 6 } |
| 7 .vertical-header { | 7 .vertical-header { |
| 8 width: 60px; | 8 width: 60px; |
| 9 } | 9 } |
| 10 .container-row { | 10 .container-row { |
| (...skipping 17 matching lines...) Expand all Loading... |
| 28 } | 28 } |
| 29 .flipped-blocks { | 29 .flipped-blocks { |
| 30 writing-mode: vertical-rl; | 30 writing-mode: vertical-rl; |
| 31 } | 31 } |
| 32 .flipped-lines { | 32 .flipped-lines { |
| 33 writing-mode: vertical-lr; | 33 writing-mode: vertical-lr; |
| 34 } | 34 } |
| 35 .flex { | 35 .flex { |
| 36 border: 2px solid red; | 36 border: 2px solid red; |
| 37 display: flex; | 37 display: flex; |
| 38 overflow: scroll; | 38 overflow: auto; |
| 39 max-width: 100px; | 39 max-width: 100px; |
| 40 max-height: 100px; | 40 max-height: 100px; |
| 41 } | 41 } |
| 42 .column { | 42 .column { |
| 43 flex-direction: column; | 43 flex-direction: column; |
| 44 } | 44 } |
| 45 .column-reverse { | 45 .column-reverse { |
| 46 flex-direction: column-reverse; | 46 flex-direction: column-reverse; |
| 47 } | 47 } |
| 48 .row { | 48 .row { |
| (...skipping 28 matching lines...) Expand all Loading... |
| 77 <div class="vertical-header rtl flipped-blocks">rtl<br>vertical-rl</div> | 77 <div class="vertical-header rtl flipped-blocks">rtl<br>vertical-rl</div> |
| 78 <div class="vertical-header rtl flipped-blocks">rtl<br>vertical-lr</div> | 78 <div class="vertical-header rtl flipped-blocks">rtl<br>vertical-lr</div> |
| 79 </div> | 79 </div> |
| 80 | 80 |
| 81 <script> | 81 <script> |
| 82 flexDirections.forEach((flexDirection) => { | 82 flexDirections.forEach((flexDirection) => { |
| 83 var containerRow = createContainerRow(flexDirection); | 83 var containerRow = createContainerRow(flexDirection); |
| 84 document.body.appendChild(containerRow); | 84 document.body.appendChild(containerRow); |
| 85 }); | 85 }); |
| 86 </script> | 86 </script> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 1930183002:
Refactor scroll updates during flexbox layout. (Closed)
Base URL: https://chromium.googlesource.com/chromium/src@rtl-scroll-origin