iPad 3 Webapp在移动Safari中崩溃

我一直在调试我们的Web应用程序几天，我不确定是什么导致它在移动Safari中崩溃。该应用程序在iPad2上出色地工作，但由于某种原因它在iPad3上崩溃。我评论了每一段代码，看起来问题是元素上的绝对定位。这是我的部分代码。iPad 3 Webapp在移动Safari中崩溃

.page .main-content .study-bo { 
    background: #F4F4F4; 
    border-top: 1px solid #D1D1D1; 
    border-bottom: 1px solid #D1D1D1; 
    width: 644px; 
    position: absolute; 
    top: 501px; 
    left: 0px; 
    padding: 30px 40px; 
    z-index:500; 
    -webkit-transition: top .5s ease-in-out; 
} 
.page .main-content .study-bo .text { 
    width: 100%; 
    height: 100%; 
    position: relative; 
    left:auto; 
} 
.page .main-content .study-bo p { 
    font-family: "FrutigerRoman"; 
    font-size: 12px; 
    color: #000000; 
    margin-bottom: 15px; 
} 
.page .main-content .study-bo .study-design { 
    width: 92px; 
    height: 20px; 
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(199, 199, 199, 1)), color-stop(100%,rgba(167, 167, 167, 1))); 
    -webkit-border-radius: 5px 5px 0px 0px; 
    border: 1px solid #999; 
    font-family: "FrutigerItalic"; 
    font-size: 13px; 
    color: white; 
    text-shadow: 1px 1px 0px #8E8E8E; 
    filter: dropshadow(color=#8e8e8e, offx=1, offy=1); 
    text-align: center; 
    padding-top: 4px; 
    -webkit-box-shadow: inset 0px 1px 0px 0px #e5e4e4; 
    position: absolute; 
    top: -26px; 
    font-style: italic; 
    z-index: 50; 
    left: 44px; 
} 
.page .main-content .study-bo .study-design .btn.active { 
    background: #6c6a6a; 
    text-shadow: 1px 1px 0px #434343; 
    filter: dropshadow(color=#434343, offx=1, offy=1); 
    -webkit-box-shadow: inset 0px 1px 0px 0px #9e9d9d; 
}

在正在使应用程序崩溃的代码的部分是：

position: absolute; 
    top: 501px; 
    left: 0px;

我不知道这是否是一个苹果的错误？我有多个元素定位绝对没有问题。如果我注释掉这三条线（并且只有那三条线），该应用就可以工作。我试过注释掉我的代码的其他部分，并保留这三行，并且它不起作用。任何人有任何建议？谢谢！

来源

2012-06-08 user1445097

它可能是一个错误，但很难说，没有亲眼看到和探索webapp。我会尝试与布局拨弄尝试：

获得相对定位的工作，而不是绝对的，
使用百分比，而不是在顶部的像素和左属性，
与浮动工作：左或浮动：权，保证金或填充，而不是绝对定位，
你的其他CSS之前使用一个CSS复位/正规化，像normalize.css，看看是否能神奇地解决了这个问题，
或作为最后手段，看看不会强迫你的另一种布局在这里使用绝对定位。

这些都是黑暗中的镜头，但也许他们会帮助。

来源

2012-12-21 15:19:48

iPad 3 Webapp在移动Safari中崩溃

回答

相关问题