| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <style> | |
| .arrow { | |
| width: 0; | |
| height: 0; | |
| margin: 10px; | |
| } | |
| .left, .right{ | |
| border-top: 19px solid transparent; | |
| border-bottom: 19px solid transparent; | |
| } | |
| .up, .down{ | |
| border-left: 19px solid transparent; | |
| border-right: 19px solid transparent; | |
| } | |
| .right { border-left: 61px solid purple; } | |
| .left { border-right: 61px solid purple; } | |
| .up { border-bottom: 61px solid purple; } | |
| .down { border-top: 61px solid purple; } | |
| </style> | |
| <script> | |
| if (window.testRunner) testRunner.dumpAsText(true); | |
| </script> | |
| </head> | |
| <body> | |
| <div class="arrow right"></div> | |
| <div class="arrow left"></div> | |
| <div class="arrow up"></div> | |
| <div class="arrow down"></div> | |
| </body> | |
| </html> |