2012-04-02 14 views
0

フォーラムアプリケーションの投稿のスクリーンショット。私は奇数の記事を偶数の記事とは異なる色にしたいと思っています。これがフォーラムアプリケーションがこのように設定する理由です。 Rails:動的に生成された奇数をスタイリングする

はちょうど私がスタイリングは、一般的に仕事を得ることができますを確認します私は

#posts {background-color: #e8d1d1; } 

を行なったし、期待通り全体の背景には、色を変えました。私は

.post odd {background-color: #e8d1d1; } 

をすれば、私は

#posts .post odd {background-color: #e8d1d1; } 

を行う場合

しかし、私は、私も何のスタイルを何も

を取得していないよます。私は

#posts #post_1 .post odd {background-color: #e8d1d1; } 

を行う場合でも、実際には

、私も何のスタイルを取得していませんよ。それが仕事をした場合、私は手動での記事の番号を入力する必要はありませんので、しかし、それは実際にHTMLタグの

enter image description here

答えて

0

class ES(すなわちpost_1など)私の問題を解決しないだろうスペースですdelimiteredので、class="post odd"は、HTMLタグに.odd.postの両方からCSSを継承させます。それは

.post_odd {background-color: #e8d1d1; } 

になり、それが動作するはずですので、それだけでCSSに.class宣言をアンダースコアを追加是正する

。各ポストは(すなわち#ポスト-1、#の後2参照divタグのID、のではない名前のdiv idで到達することができるので、すべての

+0

感謝をレールに関連していないが、それはまだ動作しません。 – Leahcim

+0

あなたのHTMLも正しく変更されましたか? – Azolo

+0

以前はありませんでした。まだ動かない。他の何かでなければならない。 – Leahcim

-1

まず、私はあなたがアンカータグを削除することができると思いますアンカータグ)

第二に、あなたが試みられてきた一つ一つのスタイルが間違っている:クラスのポストで別のタグの内側にタグのスタイルを

.post odd {background-color: #e8d1d1; } 

試み。

<div class="post"><odd>blah blah blah</odd></div> 

問題を表示しますか?

は、以下のことを試してみてください何の「奇数」タグにありません:

#posts .post { border: 1px solid #000; } 
#posts .odd { background: red; } 
#posts .even { background: green; } 

あなたが働いて(ない理由、それはいけません)、それはしかし、あなたが望む背景色(笑)とスタイルを修正しないことを得れば

2

oddeven行は、スタイル概念であるとRailsまたはHTMLで実装すべきではありません。 CSSでのみこれを実装してみてください。

.post:nth-child(odd) { /* ... */ } 
.post:nth-child(even) { /* ... */ } 
0

Railsの方法を使用する場合は、cycleを使用する必要があります。

これらの間で要素を削除/追加する場合は、CSSオプションが優れています。こうすることで背景色が保存されます。

EDIT ::

誤読質問:これは、スタイリングの問題で、

#posts .post.odd { background-color: #e8d1d1; }

関連する問題