方法一：将border改成outline

outline是不占据父级空间的

.chess {
    width : 50px;
    height: 50px;
    outline: 2px solid lightgray;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

方法二： 将盒子设置成border-box

.chess {
    width : 50px;
    height: 50px;
    border: 2px solid lightgray;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

原文地址：https://www.cnblogs.com/zhizhi0810/p/11624692.html