123456789101112131415161718192021222324252627282930 |
- <!DOCTYPE html>
- <link rel="match" href="reference/nested-boxes-with-hidden-overflow-and-border-radius-ref.html" />
- <style>
- .outer {
- overflow: hidden;
- border-radius: 100px;
- background-color: magenta;
- width: 500px;
- height: 500px;
- }
- .middle {
- overflow: hidden;
- border-radius: 50px;
- transform: translate(10px, 10px);
- background-color: lawngreen;
- }
- .inner {
- width: 100px;
- height: 100px;
- background-color: black;
- transform: translate(10px, 10px);
- }
- </style>
- <div class="outer">
- <div class="middle">
- <div class="inner"></div>
- </div>
- </div>
|