为什么我的边距会自动调整以使宽度相等？

Question

我有4列，每列的宽度为25％，左边距为25px，最后一个孩子的右边距为25px。 现在，结果实际上就是我想要的，每个宽度都相同，并且边距相等，但是我对它的工作方式感到困惑。 凭直觉，最后一个孩子的宽度不应该比前三个孩子小吗，因为它不仅在左边有一个边距，而且在右边还有一个边距？

const Column = styled.div`
    margin-left: 25px;
    width: 25%;
    display: flex;
    flex-direction: column;
    &:last-child {
        margin-right: 25px;
    }
`;

Answer 1

您可以使用margin：auto来获得相同的宽度和相同的边距。