CODEWITHSUNDEEP
css
ap.singh
ap.singh

Reputation: 1160

Position fixed is not working on ipad

I am trying to fix the background of my website and i have place a div "bgDiv" on my website having position fixed. It is working good on desktop. but on ipad position fixed is not working it scrolls with my whole website. and background image is repeating. is there any way to avoid scrolling the bgDiv.

 .bgDiv{
    background: url("test.jpg") repeat scroll 0 0 transparent;
    background-size: 100% 100%;
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: -2;
    height: inherit;
    }

<body>
  <div class="bgDiv"></div>
     <div class="wrapper">
          content
      </div>
</body>

Upvotes: 0

Views: 4747

Answers (1)

SaurabhLP
SaurabhLP

Reputation: 3657

Update your css with this,

.bgDiv{
    background: url("test.jpg") repeat scroll 0 0 transparent;
    background-size: 100% 100%;
    left: 0;
    position: fixed;
    top: 0;
    z-index: -2;
    height: auto;
    width:100%;
 }

If not added, add this to your code above,

 <meta name="viewport" content="width=device-width, user-scalable=no" />

You can refer to this documentation:- http://www.quirksmode.org/blog/archives/2010/12/the_fifth_posit.html

Upvotes: 1

Related Questions