How do you trim boxes within parent boxes (e.g div within div) after extending their margin outwards (using negative values)?

Question

Consider the code. I want the inner div which is a circle, to be shaped so the sides don't protrude outside parent div.
https://code.sololearn.com/WONS6qacXmol/?ref=app

Answer 1

Give
overflow: hidden;
To the parent element

Edit: in your case you also need to give
position: relative;
to the parent div

Answer 2

Thanks Programador

Answer 3

Thank you Krish , I appreciate that.