2013-06-13 2 views
7

私はGoogle Chrome(デスクトップとモバイル)で本当に奇妙な問題に直面しています。ここにはjsfiddle exampleがあります。 500%までズームインすると、divの上部に緑色の線が表示されます。背景画像が繰り返されるようです。緑色の線は私の背景イメージの一番下にあります。私はCSSの繰り返し-Xを追加しましたが、それはまだ私の画像の1つのピクセル反復する:背景のx位置を含むすべてのもの、からGoogle Chromeのズーム中に1ピクセルの背景が繰り返される

background: url('') repeat-x; 
+0

私は、Androidデバイスでは、ほとんどの場合、この問題を参照してください。デスクトップChromeでも 'background-image'sをズームしてしまいました。 –

+1

私は正しいことを覚えていれば、画像の一番下が見える_repeating_バグです。あなたは、イメージを 'background-position:left-0.5px; 'の半分のピクセルだけ上に移動することでこれを修正できるはずです。しかし、一番下のピクセルを追加する必要があります。 (しかし、私はそれを正しく覚えていれば私は今テストすることはできません)) –

答えて

2

減算の1ピクセルを。

.red-div{ 
    background-color: red; 
    height: 29px; 
    width: 300px; 
} 

.child { 
    width: 100%; 
    height: 100%; 
    background: url('') repeat-x; 
    background-position:-1px 100%; 

} 

JSFiddle

関連する問題