position fixed的宽度问题

发现一个吸底按钮不居中的bug，其父元素有padding，而底部footer左边距正常，右边距超出

.parent {
    padding: 10px;
}
.footer {
    position: fixed;
    bottom: 0;
    width: 100%;

    .button {
        margin: 5px 20px 15px;
    }
}

实际上footer元素设为position: fixed后，设置width: 100%其宽度为视口宽度，并没有像预想中为parent的宽度，所以导致视觉上没有居中，参考了stackoverflow 上的一个问题后把width: 100%改为width: calc(100% - 20px);即可。
个人不建议使用这种实现方式，应该在footer内部添加padding最好，而不在父元素全局添加padding，而且考虑到margin塌陷等问题，也不建议使用margin来限制元素的大小，应该使用padding来实现。