html - jQuery Mobile table is not aligning properly -

i want create table looks second block of image:

but when creating table this:

<div data-role="main" class="ui-content">             <table data-role="table" class="ui-responsive" id="flight-info-block">                <thead>                 <tr>                   <th>ams</th>                   <th>us 153</th>                   <th>nyc</th>                 </tr>               </thead>               <tbody>                 <tr>                   <td>oct 2</td>                   <td></td>                   <td>oct 2</td>                 </tr>                 <tr>                   <td>10:00</td>                   <td></td>                   <td>19:50</td>                 </tr>                 <tr>                   <td>gate</td>                   <td>seat</td>                   <td>duration</td>                 </tr>                  <tr>                   <td>e15</td>                   <td>b12</td>                   <td>9h 50m</td>                 </tr>               </tbody>             </table>           </div> 

the outcome because ui-table:

how can make first pic?