| <!DOCTYPE HTML> |
| <html> |
| <head> |
| <style> |
| .swipeable { |
| overflow: scroll; |
| height: 200px; |
| width: 200px; |
| } |
| .left-right-item, |
| .top-bottom-item { |
| height: 100px; |
| width: 100px; |
| } |
| .left-right-item { |
| display: inline-block; |
| } |
| .red-bg { |
| background-color: red; |
| } |
| .blue-bg { |
| background-color: blue; |
| } |
| .tall-and-wide { |
| background-color: grey; |
| height: 5000px; |
| width: 5000px; |
| } |
| </style> |
| </head> |
| <body> |
| |
| <div id="left-right" class="swipeable"> |
| <div style="width: 1000px;"> |
| <div class="left-right-item red-bg">Test</div> |
| <div class="left-right-item blue-bg">Test</div> |
| <div class="left-right-item red-bg">Test</div> |
| <div class="left-right-item blue-bg">Test</div> |
| </div> |
| </div> |
| |
| <div id="top-bottom" class="swipeable"> |
| <div class="top-bottom-item red-bg">Test</div> |
| <div class="top-bottom-item blue-bg">Test</div> |
| <div class="top-bottom-item red-bg">Test</div> |
| <div class="top-bottom-item blue-bg">Test</div> |
| </div> |
| |
| <div class="tall-and-wide"></div> |
| |
| </body> |
| </html> |
