jquery uiオートコンプリートのCSSフォーマット

Question

私はチェストーナメントのマニュアルペアリングのためのウェブベースのユーティリティを持っています。白いプレーヤーが左揃えのメニュー項目を選択し、黒いプレーヤーが右揃えのメニュー項目を選択するように、jquery UIオートコンプリートをフォーマットする必要があります。ここにリンクがあります：http://communitychessclub.com/test.php

私は、多くの混乱し、おそらく矛盾するCSSスタイル設定方法を見てきました。たとえば、次のように

ul.ui-autocomplete.ui-menu {background:pink; font-size:1.5rem; text-align:center; letter-spacing:2px;} 

.ui-widget-content.ui-menu .ui-menu-item {color: red; font-weight: bold;} 
.ui-widget-content.ui-menu .ui-menu-item {color: tan; font-weight: bold;} 

HTML：

<div class = "ui-widget white"><input type = "text" class = "automplete-2"></div> 
<div class = "ui-widget black"><input type = "text" class = "automplete-2"></div><br /> 

は、どのように私は白のプレーヤーのオートコンプリートが左寄せリストとブラックのプレーヤーのオートコンプリートが右揃えリスト持つことができます。

Answer 1

nth-of-type CSSセレクタの偶数/奇数の引数試してみてください：私はテキスト整列を必要とする

.ui-menu:nth-of-type(even) li div{ /* black */ 
    text-align: left !important; 
} 
.ui-menu:nth-of-type(odd) li div{ /* white */ 
    text-align: right !important; 
}