| <head> |
| <style> |
| div::-webkit-scrollbar { |
| width:17px; |
| height:17px; |
| } |
| |
| div::-webkit-scrollbar-button { |
| display:block; |
| width: 17px; |
| height: 17px; |
| } |
| |
| div::-webkit-scrollbar-button:vertical { |
| background-color:lightblue; |
| border:2px solid black; |
| } |
| |
| div::-webkit-scrollbar-button:horizontal { |
| background-color:#208020; |
| border:2px solid black; |
| } |
| |
| div::-webkit-scrollbar-thumb { |
| min-width:20px; |
| min-height:20px; |
| background-color: navy; |
| border:2px solid #cccccc; |
| } |
| |
| div::-webkit-scrollbar-thumb:horizontal { |
| background-color: #004000; |
| } |
| |
| div::-webkit-scrollbar-button:disabled { |
| display:none |
| } |
| |
| div::-webkit-scrollbar-track { |
| background-color: #2060a0; |
| } |
| |
| div::-webkit-scrollbar-track:horizontal { |
| background-color: #40a040; |
| } |
| </style> |
| </head> |
| <body> |
| <div style="width:200px; height:200px; overflow-y:scroll; overflow-x:scroll"> |
| Hello<br> |
| Hello<br>Hello<br>Hello<br>Hello<br>Hello<br>Hello<br>Hello<br> |
| Hello<br>Hello<br>Hello<br>Hello<br> |
| Hello<br>Hello<br>Hello<br>Hello<br> |
| <span style="white-space:nowrap">Hello world this is a long string and will not wrap.</span> |
| Hello<br>Hello<br>Hello<br>Hello<br> |
| Hello<br>Hello<br>Hello<br>Hello<br>Hello<br>Hello<br> |
| Hello<br>Hello<br>Hello<br>Hello<br> |
| Hello<br>Hello<br>Hello<br>Hello<br>Hello<br>Hello<br> |
| Hello<br>Hello<br>Hello<br>Hello<br> |
| Hello<br>Hello<br>Hello<br> |
| </div> |
