Make Image Fit to the Screen

In this code, we will see how we can set an image to fit the screen completely. By doing this we can make sure that there is repeating of images in the background.

Using The Code

Here I am setting the image to the body tag.

  1. #body {  
  2.    background: url("http://sibeeshpassion.com/content/images/indian%20flag%20banner.jpg") no-repeat center center fixed;  
  3.    -webkit-background-size: cover;  
  4.    -moz-background-size: cover;  
  5.    -o-background-size: cover;  
  6.    background-size: cover;  
  7. }  

Please see other code snippets here: Code-Snippets.