<!doctype html> <html class="reftest"> <meta charset="utf-8"> <title>Overflow-clip-margin corner shape</title> <link rel="help" href="https://www.w3.org/TR/css-overflow-3/#propdef-overflow-clip-margin"> <link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org"> <link rel="match" href="overflow-clip-margin-010-ref.html"> <style> .container { width: 100px; height: 100px; position: relative; top: 30px; left: 30px; border: 5px solid green; overflow: clip; overflow-clip-margin: 20px; border-radius: 0px 15px 25px 35px; } .child { width: 400px; height: 400px; margin: -200px; background: lightblue; opacity: 0.8; } </style> <div class=container> <div class=child></div> </div>