2011-10-06 13 views
4

Rails 3.1アプリケーションでassets/imagesgradientというディレクトリがあります。ここで私はコンパスを使用して、それらの画像からスプライトを作成するために使用するコードは次のとおりです。Compassで生成されたスプライトを "repeat-x"する方法

$gradient-repeat: repeat-x; 
@import "compass"; 
@import "gradient/*.png"; 
body > header > nav { 
    clear: both; 
    @include gradient-sprite(red-menu); 
} 

私の問題は、私は明示的に私は私の背景が水平に繰り返されるようにしたいというコンパスを教えていても、それはまだ、次のCSSを生成することである。

body > header > nav { 
    clear: both; 
    background-position: 0 -207px; 
    height: 34px; 
} 
.gradient-sprite, body > header > nav { 
    background: url(/assets/gradient-sbe06665f77.png) no-repeat; 
} 

ですから、グラデーションが水平に繰り返されることはありません。

私はGemfileにCompass gemの3.1ブランチを使用しています。

コンパイルが生成したものをオーバーライドするだけで、コードにbackground-repeat: repeat-x;を追加するだけで、Railsのやり方ではないように感じることができます。

ご協力いただければ幸いです。

+3

+1に役立ちます願っています。コンパス、私は私の背景を反復しません。注:コンパスはスプライトの幅を塗りつぶすように画像を繰り返すので、おそらく多くの人がこの問題に気付かないのです。スプライトが背景を繰り返す要素よりも狭い場合にのみポップアップします。 –

+0

おそらく、多くの人が勾配スプライトを生成するためにコンパスを使用しているわけではないので、これが気づかれなかったのかもしれません。たぶん私たちはgithubに関するバグレポートを提出するべきでしょうか? – muxcmux

+0

私はあなたが間違いなくそうするべきだと思います。私はこのために多くのコンパスを使用しますが、それが問題になるほどスプライトが狭くなることはありません。 –

答えて

0

デフォルトでは不可能ですが、この記事では巧妙なテクニックを見つけましたが、スプライトを繰り返す方法について説明しています。

Background repeat and css sprites

は、それが

関連する問題