The margin-top of the first child element node in css will act on the parent element, adding text (the text belongs to the text node) div is not the first child element node or adding overflow to the parent element.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<style>
.a{width: 400px;height: 400px;background-color: skyblue;overflow: hidden;}
.b{width: 300px;height: 300px;background-color: pink;margin: 20px auto;}
</style>
</head>
<body>
<div class="a">
<div class="b"></div>
</div>
</body>
</html>