jquery-mobile - Jquery Mobile 对齐文本框

Question

我有以下带有文本框的列表视图。我想获得与 ipad 相同的感觉。如何对齐文本框，使其正好在彼此下方。目前它看起来不匹配。

      <ul data-role="listview" data-inset="true" style="width:30%;">
  <li data-role="fieldcontain">
  <label for="name">First Name:</label>
        <input type="text" name="fname" id="fname" value=""    />            
  </li>

        <li data-role="fieldcontain">
  <label for="name">MI:</label>
        <input type="text" name="mi" id="mi" value="" style="width:5%;"  />                
  </li>
      </ul>

Answer 1

不知道为什么需要为 ul 和 input 标签设置样式。但我已经把你可以实现的不同风格的小提琴放在一起。
http://jsfiddle.net/nachiket/nnRPv/
是否有任何帮助？