css position jquery ui combobox

时间:2012-06-04 07:54:49

标签: css jquery-ui combobox position

我想定位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)

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

1 个答案:

答案 0 :(得分:0)

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

希望这有帮助。