JqueryMobile添加2列表

Question

我想添加一個使用jquerymobile 2列的響應表。

！列應該左對齊，右對齊。 結果是2列在另一列下顯示1，這不是我想要的。

如何使用響應表爲移動設備顯示2列表格，左側單元格顯示在左側，右側單元格顯示在右側，就像正常表格應該顯示的一樣，而不是下面的1個單元格另一個。 （該wepapp使用JQM）

<div data-role="main" class="ui-content"> 
<table style="width:100%" data-role="table" class="ui-responsive"> 
    <thead> 
    <tr> 
     <th data-priority="1" style="text-align:left"></th> 
     <th data-priority="1" style="text-align:right"></th> 

    </tr> 
    </thead> 
    <tbody> 
    <tr> 
     <td style="text-align:left">1</td> 
     <td style="text-align:right">Alfreds Futterkiste</td> 

    </tr> 

    </tbody> 
</table> 

Answer 1

只需刪除數據角色=表：

這裏是一個DEMO

<table id="MyTable" class="ui-responsive table-stroke"> 
    <thead> 
     <tr> 
      <th class="left">Col 1</th> 
      <th class="right">Col 2</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td class="left">Row 1 Col 1</td> 
      <td class="right">Row 1 Col 2</td> 
     </tr> 
     <tr> 
      <td class="left">Row 2 Col 1</td> 
      <td class="right">Row 2 Col 2</td> 
     </tr> 
     <tr> 
      <td class="left">Row 3 Col 1</td> 
      <td class="right">Row 3 Col 2</td> 
     </tr> 
     <tr> 
      <td class="left">Row 4 Col 1</td> 
      <td class="right">Row 4 Col 2</td> 
     </tr>     
    </tbody> 
</table> 

#MyTable { 
    width: 100%; 
} 
#MyTable .left { 
    text-align: left; 
} 
#MyTable .right { 
    text-align: right; 
}