I've searched everywhere for a solution to this but can't seem to solve it. The main background image here zooms in massively on iPhone. This is my background image code:
.home-featured {
background-image: url(/Roombg2.jpg);
background-repeat: no-repeat;
background-position: center center;
background-attachment: scroll;
background-color: #bbbbbb;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
I'm not sure if other CSS for home-featured is causing any problems:
.home-featured .wrap {
margin-top: -160px;
max-width: 782px;
display: table;
text-align: center;
}
.home-featured .home-widgets-1 {
display: inline-block;
display: table-cell;
vertical-align: middle;
width: 100%;
padding: 200px 0;
font-size: 20px;
}
Any help would be hugely appreciated - I'm completely lost on this!
Probably you need to configure the meta viewport tag. In the iphone the viewport behaves a little different.
Check this: Configuring the viewport
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.