| <!DOCTYPE HTML> | |
| <html> | |
| <head> | |
| <meta http-equiv="Content-type" content="text/html; charset=utf-8"> | |
| <style type="text/css" media="screen"> | |
| .reflected { | |
| position: relative; | |
| width: 2150px; | |
| height: 200px; | |
| background-color: green; | |
| opacity: 0.5; | |
| -webkit-box-reflect: below -50px; | |
| } | |
| * { margin: 0; padding: 0; } | |
| </style> | |
| </head> | |
| <p>Opacity should be applied after reflection, so you should see a green rectangle below. The overlap between the original and reflection should not be visible.</p> | |
| <div class="reflected">1 | |
| </div> | |
| </html> |