I made this code shown below to display a background image. It is possible to make it fixed for all resolution without showing white background?

CSS code:

    background-attachment: fixed;
    background-image: url(../layout/background.jpg);
    position: absolute;
    min-height: 768px;
    min-width: 1024px;


Your code is fine, no problem there.

The reason for this is because your background image is clearly the wrong dimesions to support mobile resolutions. If you'd like me to check to give you a definitive answer, upload/link to your background image.

I use this image. It is better to make it smaller through photoshop and uploaded again?


The danger with background images is that they have to be big enough to support all devices, so they have to be big. This goes against every 'good' web practice with images, as you're always told to reduce the size.

If you really want to use a background image, make it fairly big (at least 1200px wide). Save it in Photoshop with a reasonable amount of quality, but focus on the filesize.

Try this:

body{background: #000 center/100% no-repeat fixed url(../layout/background.jpg);}