<html> | |
<head> | |
<style> | |
.outer { width:200px;height:200px;background-color:lime; -webkit-box-reflect: right 10px; } | |
.inner { width:100px;height:100px;background-color:blue; -webkit-box-reflect: below; } | |
</style> | |
</head> | |
<body> | |
The two lime squares below should look like mirror images (with a blue rectangle filling half the left square on the left and half the right | |
square on the right). | |
<div class="outer"> | |
<div class="inner"> | |
</div> | |
</div> |