| <!DOCTYPE html> |
| <style> |
| body { |
| -webkit-writing-mode: vertical-lr; |
| } |
| .multicol { |
| height: 480px; |
| width: 200px; |
| border: 3px solid black; |
| -webkit-column-gap: 0; |
| -webkit-column-count: 3; |
| line-height: 20px; |
| } |
| .float { |
| padding: 10px; |
| background-color: skyblue; |
| } |
| .left { float: left; } |
| .right { float: right; } |
| </style> |
| <div class="multicol"> |
| First<br> |
| First<br> |
| First<br> |
| First<br> |
| <div class="float left">L1</div> |
| <div class="float right">R1</div> |
| First<br> |
| First<br> |
| First<br> |
| First<br> |
| First<br> |
| First<br> |
| |
| <div class="float left">L2</div> |
| <div class="float right">R2</div> |
| Second<br> |
| Second<br> |
| Second<br> |
| Second<br> |
| Second<br> |
| Second<br> |
| Second<br> |
| Second<br> |
| Second<br> |
| Second<br> |
| |
| Third<br> |
| Third<br> |
| Third<br> |
| Third<br> |
| Third<br> |
| Third<br> |
| Third<br> |
| Third<br> |
| <div class="float left">L3</div> |
| <div class="float right">R3</div> |
| Third<br> |
| Third<br> |
| </div> |
