alineando elementos de selección HTML en una línea

Question

estoy trabajando en una aplicación móvil usando HTML/CSS/JavaScript. Tengo dos opciones de selección (menú desplegable), una para el número de fechas y la otra para el número de años. Quiero poder ver estas opciones de selección en una línea, pero no importa lo que haga, obtengo un menú desplegable (número de fechas) en una línea y en la línea siguiente obtengo el menú desplegable por varios años. . A continuación puede ver mis códigos

<div data-role="controlgroup" data-type = "horizontal" > 

     <label for="select-choice-1" >Choose Expiry Date</label> 
      <select name="select-choice-1" id="select-choice-1" data-inline = "true" style = "float: left"> 
       <option value="1">01</option> 
       <option value="2">02</option> 
       <option value="3">03</option> 
       <option value="4">04</option> 
       <option value="5">05</option> 
       <option value="6">06</option> 
       <option value="7">07</option> 
       <option value="8">08</option> 
       <option value="9">09</option> 
       <option value="10">10</option> 
       <option value="11">11</option> 
       <option value="12">12</option> 
       <option value="13">13</option> 
       <option value="14">14</option> 
       <option value="15">15</option> 
       <option value="16">16</option> 
       <option value="17">17</option> 
       <option value="18">18</option> 
       <option value="19">19</option> 
       <option value="20">20</option> 
       <option value="21">21</option> 
       <option value="22">22</option> 
       <option value="23">23</option> 
       <option value="24">24</option> 
       <option value="25">25</option> 
       <option value="26">26</option> 
       <option value="27">27</option> 
       <option value="28">28</option> 
       <option value="29">29</option> 
       <option value="30">30</option> 
       <option value="31">31</option> 
      </select> 

      <select name="select-year" id="select-yaer" data-inline = "true" style = "float: right"/> 
       <option value="2011">2011</option> 
       <option value="2012">2012</option> 
       <option value="2013">2013</option> 
       <option value="2014">2014</option> 
       <option value="2015">2015</option> 
       <option value="2016">2016</option> 
       <option value="2017">2017</option> 
       <option value="2018">2018</option> 
       <option value="2019">2019</option> 
       <option value="2020">2020</option> 
       <option value="2021">2021</option> 
       <option value="2022">2022</option> 
       <option value="2023">2023</option> 
       <option value="2024">2024</option> 
       <option value="2025">2025</option> 
       <option value="2026">2026</option> 
       <option value="2027">2027</option> 
       <option value="2028">2028</option> 
       <option value="2029">2029</option> 
       <option value="2030">2030</option> 

      </select><br /> 

     </div> 

ACTUALIZACIÓN: estoy probando estos códigos en el navegador de Android utilizando el framework jQuery móvil.