Search code examples
imagecssbackgroundsizedimensions

CSS3 Hero Image: Whats the best pixel dimension and Image Size for a full screen responsive background?

CSS3 Hero Image question:

Whats the best pixel dimension and Image Size for a full screen responsive background?

Whenever I use the cover property, it always seems to miss out most the image.

Thanks,

Steve

Solution

  • Used photoshop to crop the image to a 16:9 ratio, 1920 x 1080 pixel dimension for best image quality. Seems to work well with my website, hopefully the file size (507kb) won't be an issue on page loading response times.