2010-12-02 10 views
16

私のWebアプリケーションでは、1行おきに異なる背景で色付けされた表が必要です。私は、GWTを使用していますので、私のUiBinderサンプルメッセージファイルに私はこのようないくつかのスタイル情報を持っている:GWTでUiBinderでnth-child CSSセレクタを使用

<ui:style> 
    .productlist { 
    cursor: pointer; 
    width: 50em; 
    padding: 10px 10px 0px 10px; 
    } 

    .productlist tr:nth-child(even) { 
    background-color: silver; 
    } 
</ui:style> 

私はそれがブラウザで動作として、これは正しいCSSであると信じています。しかし、devモードでアプリを実行すると、CSSが解釈できないというエラーが表示されます。私が「偶数」を「5」に置き換えると、Uibinderが予想通りに<IDENT>と言うエラーが表示されます。

GWTでnth-child CSSセレクタを使用したことがありますか?

+0

n番目の子は、CSS 3の一部であり、それはIE 8と、古いでは利用できません。 [この概要](http://reference.sitepoint.com/css/pseudoclass-nthchild)を参照してください。 GWTもIEとの互換性を試していますので、予期せぬことではありません。回避策があるといいですね(私は[リテラル関数](http://code.google.com/webtoolkit/doc/latest/DevGuideClientBundle.html#Literal_function)がここで動作するとは思わない) –

+0

In z00bsの回答に記載されている問題は回避策がありますが、うまくいきません。実際の回避策は、他のすべての行にプログラム的にスタイルを追加することだと思います。 –

答えて

27

これはknown issueです。

あなたが悪いGWT CSSパーサーを混乱を避けるために括弧をエスケープすることにより、この問題を回避することができます

.productlist tr:nth-child\(even\) { 
    background-color: silver; 
} 
+0

OMG私は狂っていると思った、ありがとう! – Manu

関連する問題