Homan
Homan

Reputation: 26718

width:100% not extending all the way in ipad portrait mode

I have a webpage whose width is over 1000px wide. There is a background DIV element that spans across the entire width

.bg_horizon {
  position:absolute;
  width:100%;
  height:800px;
  background-color:#f7f7f7;
  border-bottom:1px solid #8d9092;
  z-index:-9999;
  margin:0;
  padding:0;
}

This box renders fine in landscape orientation and on desktops, but on ipad portrait mode the webpage is wider than the viewport... this is fine, as the user can just pan around, we don't allow scaling... but the background div only rendered the css width:100% up to the visible portion of the viewport. When I pan around, I can see the rest of the webpage but the div did not extend into those areas. How can I get width:100% to span across the entire webpage?

Upvotes: 0

Views: 846

Answers (1)

Mirko Mukaetov
Mirko Mukaetov

Reputation: 204

iPad screen width is 1024px so try adding:

html {
    min-width: 1024px;
    }

Upvotes: 1

Related Questions