css position jquery ui combobox

Question

我想定位jQuery UI combox。我有不止一个，但并非所有人都必须处于相同的相对位置。

这是我的代码：

HTML：

<div>
   <select id="comboSubsidiary" class="comboTravel" >
      <option>loading</option>
   </select>
</div>

<div>
   <select id="comboCountry" class="comboWork">
      <option>loading</option>
   </select>
</div>

CSS：

div.comboTravel{position: relative; left: 410px; top: -23px; display: inline-block; }

上面的CSS不起作用。

以下css有效：

.ui-combobox{position: relative; left: 110px; top: -23px; display: inline-block; }
        .ui-button {
            position: absolute;
            top: 0;
            bottom: 0;
            margin-left: -1px;
            padding: 0;
            /* adjust styles for IE 6/7 */
            *height: 1.7em;
            *top: 0.1em;
        }
        .ui-autocomplete-input {
            margin: 0;
            padding: 0.3em;
        }

但是使用这个css，所有的组合框都以相同的方式定位。我想要一些组合框来使用css类，但我不知道如何访问它们（例如css-class comboTravel或comboWork）

我怎样才能让它发挥作用？

Answer 1

我可以看到div.comboTravel类的顶部为-23px，这可能是因为组合框没有出现在屏幕上。我尝试删除它并为comboWork创建另一个类，它对我有用。这是jsFiddle，如[http://jsfiddle.net/nAC8N/2/]

希望这可以帮助。