Kedar B
Kedar B

Reputation: 784

How to set background image for body tag using css?

This is my css...

   body{    
   background: url(<?php echo base_url()."images/1.jpg";?>) no-repeat center
   center fixed;
   background-size: cover;
   -moz-background-size: cover;

  -webkit-background-size: cover;

  -o-background-size: cover;
   height: 100%;

   position:absolute; 
   width:100%;
 }

I want to set image as full background fit to screen dimensions. Now image displaying as full background but some lower portion of image is not displaying. So what will be the solution??

Upvotes: 1

Views: 4266

Answers (1)

jbutler483
jbutler483

Reputation: 24549

You can set the background-size to 100% 100% to 'stretch' the image instead.

Note. canIuse states that prefixes aren't needed for background-size properties.

 body {
   background: url(http://placekitten.com/g/300/300) no-repeat center center fixed;
   background-size: 100% 100%;
   height: 100%;
   position: absolute;
   width: 100%;
 }

Upvotes: 4

Related Questions