Why does the layout move out completely on IOS OS?

K

Konstantin2016-08-17 20:31:07

css

Konstantin, 2016-08-17 20:31:07

Why everything completely crashes in any browser on devices with an installed IOS system (on Mac, Windows, Android and Linux on any browsers everything is fine)
recent.look-website.xyz
Made up on flexboxes.
Gulp Autoprefixer costs: last 5 versions, tried more, doesn't help.
Thanks in advance.
PS I am attaching a link to the github repository, I hope this will make it easier to identify the problem https://github.com/Yaphtes/coha

Reply

Answer the question

In order to leave comments, you need to log in

2 answer(s)

Z

zooks, 2016-08-22
@zooks

Yes, there is a problem with Safart browser on iPhone.
Start at least by fixing the HTML errors that are visible in the validator.
Without this, there is nothing to even judge.
Set Autoprefixer to last 2 versionsto disable IE7 support.

A

Andrey, 2016-08-17
@f-end

Surprisingly, only on IOS, apparently, other browsers are more loyal.
All meta tags must be added to the head, and not after:

<head lang="ru"></head>
  <meta charset="UTF-8">
  <title>coha</title>
  <meta name="description" content="">
  <meta http-equiv="X-UA-Compatible" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta property="og:image" content="path/to/image.jpg">
  <script src="js/flexibility.js"></script>
  <link rel="stylesheet" href="css/screen.css">
  <link rel="stylesheet" href="css/jquery.formstyler.css">

I also recommend adding tags:

<meta name="HandheldFriendly" content="True">
        <meta name="MobileOptimized" content="width">