| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <style> | |
| .outer { | |
| overflow:hidden; | |
| border-radius: 1px; | |
| display:flex; | |
| backface-visibility: hidden; | |
| } | |
| #child-overflow { | |
| border-radius: 5px; | |
| overflow:hidden; | |
| background-color: lightblue; | |
| width: 100px; | |
| height: 40px; | |
| z-index:1 | |
| } | |
| #sibling { | |
| background-color: green; | |
| width: 100px; | |
| height: 40px; | |
| z-index:1 | |
| } | |
| </style> | |
| </head> | |
| <div class="outer"> | |
| <div id="child-overflow"></div> | |
| <div id="sibling"></div> | |
| </div> |