CSS：重复线性渐变，但不重复背景图片

Question

我希望背景具有一组不同的颜色。尝试了下面的测试代码，即可完成工作。

body  {
    background: linear-gradient(to right, orange 70%, grey 30%);
}

我还希望图像位于右上角（无重复），该图像应位于上述背景色之上。

body  {
    background: url('my_image.png'), linear-gradient(to right, orange 70%, grey 30%);
    background-position: top right;
    background-repeat: no-repeat;
}

但是，当我这样做时，背景颜色（渐变）在顶部变成一条细条。问题在于无重复选项。我不希望图像重复，但我希望背景色（以线性渐变设置）可以一直到正文结尾。

我如何做到这一点？