This is because setting background-attachment: fixed
alters the background positioning area to that of the initial containing block, which is always the size of the viewport. From the spec:
If the ‘background-attachment’ value for this image is ‘fixed’, then [the ‘background-origin’ property] has no effect: in this case the background positioning area is the initial containing block [CSS21].
The behavior of background-size: cover
is then influenced accordingly.
You can still achieve the desired behavior with a fixed background by setting background-size: auto 50%
instead, so its height scales to 50% that of the page, mirroring the height you have given to the element, and its width adjusts to scale:
-moz-background-size: auto 50%;
-webkit-background-size: auto 50%;
-o-background-size: auto 50%;
background-size: auto 50%;
Notice that I've also moved the standard background-size
declaration to the bottom to ensure all browsers use that one over the non-standard implementations where available.