CSS background-image resizes when I set background

问题:

I have a div named "page". I set its background-image with CSS, using the code below. I size the image to take 100% of the div's width, and it sets nicely its height to keep its scale. But when I set "background-attachment: fixed", it resizes the image. It increases the image size, and now it doesn't fit into my div, so most of it is cut. I will highly appreciate any help.

The CSS code:

    #page {
        height: 100%;
        width: 60%;
        margin: 0 auto;
        background-image: url('bg2.jpg');
        -webkit-background-size: 100% auto;
        -moz-background-size: 100% auto;
        -o-background-size: 100% auto;
        background-size: 100% auto;
        background-repeat: no-repeat;
        background-attachment: fixed;
    }

回答1:

I have just encountered the same issue with a background image sized using background-size: contain;.

When I set the background-attachment to fixed, the sizing no longer applies to the element carrying the background image, but instead it seems to apply to the viewport, so it's much larger and extends beyond the original element.