| <style> |
| .container { |
| width: 90px; |
| height: 90px; |
| display: inline-block; |
| background-color: black; |
| margin: 10px; |
| } |
| .box { |
| width: 100px; |
| height: 100px; |
| display: inline-block; |
| background-color: green; |
| } |
| </style> |
| <body> |
| <div> |
| <div class="container" style="transform: translate(-10px, -10px);"> |
| <div class="box" style="transform: translate(10px, 10px);"></div> |
| </div> |
| |
| <div class="container" style="transform: translate(30px, -10px);"> |
| <div class="box" style="transform: translate(-20px, 10px);"></div> |
| </div> |
| </div> |
| <div> |
| <div class="container" style="transform: translate(-10px, 30px);"> |
| <div class="box" style="transform: translate(10px, -20px);"></div> |
| </div> |
| |
| <div class="container" style="transform: translate(30px, 30px);"> |
| <div class="box" style="transform: translate(-20px, -20px);"></div> |
| </div> |
| </div> |
| </body> |
