How to deal with background scaling on iphone on page refresh?

Question

Layout

How to deal with background autoscaling on iphone (safari) on page refresh?
When you drag a page up or down on your phone to refresh it, the screen area shrinks and the background scales. The background is inserted through the slider from the theme settings in worpress.
input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type ="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"] , input[type="time"], input[type="url"], input[type="color"], textarea {
height: 3.250rem;
}
html input[type="button"],
input[type="reset"], input[type="submit"] { background-clip: padding-box;
background-color: #888f9e;
border: medium none;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px
color:white;
font-size: 0.8125rem
font-style: italic;
padding: 0.45em 1.6em;
-o-transition: all 0.2s ease-in-out 0s;
-ms-transition: all 0.2s ease-in-out 0s;
-moz-transition: all 0.2s ease-in-out 0s;
-webkit-transition: all 0.2s ease-in-out 0s;
transition: all 0.2s ease-in-out 0s;
}
html input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover {
background-color: #70788a;
}
input[type="text"], input[type="password"] {
-webkit-border-radius:
-moz-border-radius: 3px;
border-radius: 3px
}