Question

我网站上的一个网页都不想显示在Apple产品上。我已将问题缩小为一行。以下代码是我的页面之一的顶部。
如果我删除“ position：fixed;”行它将解决iPhone问题，但随后我的页面看起来很差，图像四处移动。有人有什么想法吗？谢谢您的帮助。

<head>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-7503495-5"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-7503495-5');
</script>
</head>
<style>
.modalDialog {
        position: fixed;
        font-family: Arial, Helvetica, sans-serif;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: rgba(0,0,0,0.8);
        z-index: 99999;
        opacity:0;
        -webkit-transition: opacity 400ms ease-in;
        -moz-transition: opacity 400ms ease-in;
        transition: opacity 400ms ease-in;
        pointer-events: none;
    }
    .modalDialog:target {
        opacity:1;
        pointer-events: auto;
    }
    .modalDialog &gt; div {
        width: 90%;
        max-width: 650px;
        position: relative;
        margin: 10% auto;
        border-radius: 10px;
    }
    .close {
        background: #000;
        color: #FFFFFF;
        line-height: 25px;
        position: fixed;
        right: 50px;
        text-align: center;
        top: 50px;
        width: 25px;
        text-decoration: none;
        font-weight: bold;
        -webkit-border-radius: 12px;
        -moz-border-radius: 12px;
        border-radius: 12px;
        -moz-box-shadow: 1px 1px 3px #000;
        -webkit-box-shadow: 1px 1px 3px #000;
        box-shadow: 1px 1px 3px #000;
    }
    .close:hover { background: #ffc72c; }
</style>

我的网站上的页面未在iPhone或iPad上显示

0 个答案: