Does anyone know how to make the repeating background 'start' fixed at the bottom of the div and overflow on the top? I want it to be the opposite of the default behavior.
Let me illustrate what I'm trying to achieve with a small example. In the image below, the red lines represent the borders between different divs. The middle div serves as a transition between the upper and lower ones, containing a single non-repeating image. The lower div has a background made up of a repeating darker image with a paper hole, creating the paper border effect shown below.
The challenge is to have the upper div (which contains substantial content) display a repeating background image that starts at the bottom and repeats upwards. This will help maintain the correct distance ratio between the holes, preventing any gaps or partial holes in the 'paper border.'
Ideally, this solution should work seamlessly with method 4 of equal height columns, but I don't foresee any issues with compatibility there.