Jquery mobile 如何使用jquerymobile在一行中显示多个

Jquery mobile 如何使用jquerymobile在一行中显示多个,jquery-mobile,Jquery Mobile,我想用jquerymobile连续显示两个日期。但它只在桌面浏览器中工作。在移动浏览器中,将在独立行中显示 <div data-role="fieldcontain"> <label for="time_start" class="ui-hidden-accessible">time_start:</label> <label for="time_end" class="ui-hidden-

我想用jquerymobile连续显示两个日期。但它只在桌面浏览器中工作。在移动浏览器中,将在独立行中显示

<div data-role="fieldcontain">
                <label for="time_start" class="ui-hidden-accessible">time_start:</label>
                <label for="time_end" class="ui-hidden-accessible">time_end:</label>
                <input type="date" name="time_start" value="2011-05-30" /> — <input type="date" name="time_end" value="2011-05-30"/>
</div>

您是否尝试过将标签和输入放在一个范围内?

也许您可以使用网格实现它

<div class="ui-grid-a">               
    <div class="ui-block-a"><label for="time_end" class="ui-hidden-accessible">
      time_end:    </label>  
    <div class="ui-block-b"><label for="time_end" class="ui-hidden-accessible">
      time_end:    </label>                 
</div>

例如,Float:left和width:80应该可以满足您的需要。下面是一个小按钮和大按钮的示例

祝你好运

.floatleft {
    float:left;
 }
.floatright {
    float:right;
 }
.forceinline{  /* Prevent fieldcontain from doing a BLOCK thing */
    display:inline !important;
}
.textwidth {  /* limit width of input fields */
    width:80px;
}
.closespacing { /* controls spacing between elements */
    margin:0px 5px 0px 0px;
 }
.bigselect {   /* centers select with big buttons */
    padding: 0px;
    margin:2px 5px 0px 0px;
 }
.biginputheight {   /* matches text input height to big buttons */
    padding-top:10px !important;
    padding-bottom:12px !important;
}
.miniinputheight { /* matches text input height to minibuttons */
    padding-top:5px !important;
    padding-bottom:5px !important;
}
<div data-role="page" class="type-home">

<ul data-role="listview">
  <li  data-role="fieldcontain">first LI line</li>
  <li  data-role="fieldcontain">

    <div class='floatleft closespacing'>
        Big Buttons<br>More Text
    </div>

    <div  class='floatleft textwidth'>
      <input type="date" placeholder="#1" class='biginputheight'></input>
    </div>  

    <div  class='floatleft textwidth'>
      <input type="date" placeholder="#2" class='biginputheight'></input>
    </div>  


  </li>
  <li  data-role="fieldcontain">

    <div class='floatleft closespacing'>    
        Small Buttons
    </div>

     <div  class='floatleft textwidth'>
      <input type="date" placeholder="s1" class='miniinputheight'></input>
    </div>  

    <div  class='floatleft textwidth'>
      <input type="date" placeholder="s2" class='miniinputheight'></input>
    </div>  

   </li>
  <li  data-role="fieldcontain">last LI line</li>

</ul><!-- /listview -->