javascript - CSS 问题 : can't place text right of select box

Question

为什么选择框下方会出现“用户”一词？我希望它位于选择框的右侧。我错过了什么？

http://jsfiddle.net/njh85/6/

Answer 1

你可以这样做:

HTML:

<div class="ui-widget">
          <select id="users" name="userName">
            <option value="#">
              Select one...
            </option>
            <option value='1'>
              User1
            </option>
            <option value='2'>
              User2
            </option>
            <option value='3'>
              User3
            </option>
            <option value='4'>
              Demo
            </option>
          </select>
</div>
<div id="user">Here is a sample sentence :)</div>

​ CSS:

/*Users Combobox*/
.ui-combobox {
    position: relative;
    display: inline-block;
    margin-right: 36px;
}
.ui-combobox-toggle {
    position: absolute;
    top: 0;
    bottom: 0;
    margin-left: -1px;
    padding: 0;
    /* adjust styles for IE 6/7 */
    *height: 1.7em;
    *top: 0.1em;
}
.ui-combobox-input {
    margin: 0;
    padding: 0.3em;
}
#user {
 position: relative;
 top: -27px;
 left: 270px;   
}

​ fiddle :

http://jsfiddle.net/FlameTrap/njh85/10/

您所要做的就是将文本从通常的位置向左和向上移动，这可以通过使用: position: relative 。此外，文本位于 <div> 之外.