1

すべての私の髪を引っ張った後、iOS で間違ってレンダリングされているように見えるこの最小限の HTML ページにたどり着きました:

<!doctype html>
<html>
<head>

<style type="text/css">

#fold
{
    background:url(https://s3.amazonaws.com/gigantt_pub_imgs/2012/07/1342078193.png) top left;
    min-height:350px;
}


#features
{
    background:url(https://s3.amazonaws.com/gigantt_pub_imgs/2012/07/1342078193.png) top left;
    min-height:350px;       
}   
</style>
</head>
<body>
    <div id="fold">
    </div>
    <div id="features">

    </div>
</body>
</html>

iOS (または iOS シミュレーター) で表示すると、2 つの青い div の間に while 線が表示されます。

ここに画像の説明を入力

この白い線は、ズームインすると消えます。もちろん、私が試した他のデスクトップ ブラウザでも表示されません。

それで、私は気が狂っていますか、それとも他の誰かがこれを手に入れていますか？それを回避する方法はありますか？

4

1 に答える 1

3

これはバグとして解釈される可能性があります (私はそうだと思います) - しかし、これはiOS が背景画像を処理する方法に関係しています。

簡単な答えは、要素の 1 つに負のマージンを追加することです。この JSFiddle を参照してください。

関連する部分は次のとおりです。

#features
{
    background:url(https://s3.amazonaws.com/gigantt_pub_imgs/2012/07/1342078193.png) top left;
    min-height:350px;
    margin-top: -2px;    
}

メディア クエリを使用して、これをターゲットにすることができます。

于 2012-07-12T13:32:20.067 に答える