为什么CSS背景原点的行为会因宽度而异？

我很好奇为什么背景原点的行为会因其应用到的元素的宽度而有所不同

我有两个div，除了宽度之外，所有CSS都是相同的：

col-sm-1 width: calc(100% * 1 / 12);
col-sm-6 width: calc(100% * 6 / 12);

例如：

当我使用背景原点：内容框应用背景图像时，右侧和底部的填充在较大的div上是“服从”的，但在较小的div上不是

我知道我可以在较小的div上使用背景剪辑和背景原点，以获得类似的视觉效果，如col-sm-2所示

---

我很好奇为什么默认行为不同。

对我来说，两者的行为都一样。填充右侧被覆盖，而不是填充左侧您使用的是哪个浏览器？我刚刚在Chrome、Firefox、Opera和Safari上检查了这一点。Chrome、Firefox和Opera将右边的填充显示为col-sm-6未覆盖。Safari确实覆盖了sm-1和sm-6的右侧填充物。