請問為什么在沒有設(shè)置border屬性的情況下，margin會無法居中？

        <style>
            body{
                padding : 50px;
            }
            .parent{
                width : 50px;
                height : 50px;
                background-color : white;
                border : 1px solid white;
            }
            .parent:hover{
                width : 50px;
                height : 50px;
                background-color : orange;
                border : 1px solid white;
            }
            .child{
                width : 44px;
                height : 44px;
                background-color : white;
                margin : 3px;
            }
        </style>

下面這張圖是沒有border屬性的情況下用hover選擇器改變的背景色

這張圖是有border屬性的情況下用hover選擇器改變的背景色