flex布局中padding-right失效的问题

在设置flex布局时给父盒子添加了左右内边距，但是仅显示padding-left，而padding-right失效。

父盒子代码：

/* flex布局，让俩子盒子一个靠左，一个靠右 */
    display: flex;
    justify-content: space-between;
    /* 子盒子垂直居中 */
    align-items: center;

    /* 父盒子宽高*/
    height: 80px;
    width: 90%;

但是结果右边的子盒子紧贴右边，像这样：

问题出在父盒子的width，将100%调小就能展示padding-right，应该是盒子被往右挤压了，边距部分超出盒子范围

解决方案：将父盒子的width调小，我选择调到90%，里面内容都能展示，而且右边不会出现留白

width: 90%;

效果图👇

问题解决！