Jquery Mobile 选择和按钮内联答案

【问题标题】：Jquery Mobile select and button inlineJquery Mobile 选择和按钮内联
【发布时间】：2015-09-29 17:42:56
【问题描述】：

我正在尝试有一个选择菜单和一个内联按钮，与周围的线条宽度相同，请参见： http://jsbin.com/hibatehepe/edit?html,output

这里是用字段容器完成的，但是选择菜单应该更宽。请问有什么想法吗？

【问题讨论】：

标签： jquery-mobile inline-editing

【解决方案1】：

你可以看看这个问题：

How to make a div to fill a remaining horizontal space?

mystrdat 基于此 codepen 的答案：http://codepen.io/anon/pen/mdoej 可以为您工作。

你基本上使用float:right来让按钮一直保持在右侧的固定宽度，然后select的容器会自动填充可用宽度。（注意：我只是使用内联 CSS 来快速说明答案，您应该使用 CSS 类）：

<div class="ui-field-contain">
  <label for="b" class="select">Vælg kategori:</label>
  <div >
    <div style="float: right; padding-left: 0.5em;" >
      <a href="#" class="ui-btn ui-shadow ui-btn-inline ui-icon-plus ui-btn-icon-right ui-corner-all" data-inline="true">Tilføj</a>
    </div>
    <div style="overflow: auto;">
      <select size="1" name="b" id="b" data-native-menu="false">
        <option value="choose-one" data-placeholder="true">MAKE ME WIDE</option>
      </select>
    </div>
  </div>
</div>

Updated jsbin

【讨论】：