Hi Shreerang
I have the basic JQueryMobile 1.3.1 CSS sheet loaded, and here are pics of two problems:
1) Larger tables get cut off and there is no scroll left-right option on the desktop or a mobile browser. My only fix was to make the font-size small, but this was not enough.
2) Reflow seems like a good solution to large tables, but the second image shows how I am seeing the header column twice in that case. Here is my code for the second image:
<table id="Ross-Konigsberg-2002" data-role="table">
<caption>
</br>Eastern European Males, from Table 1 (167)
</br>Use <em>m*x+b ± 2*SD </em>to find estimated stature <em>y</em>
</caption>
<thead>
<tr>
<th>Element, cm (<em>x</em>)</th>
<th>Multiplier (<em>m</em>)</th>
<th>Y-intercept (<em>b</em>)</th>
<th>S.D.</th>
</tr>
</thead>
<tbody>
<tr>
<th>Fem</th>
<td>2.3622</td>
<td>63.456</td>
<td>3.3</td>
</tr>
... etc
</tbody>
</table>
Here's the regular version of that small table - seems basic and like it should work with reflow:
3) In other news, I am trying to learn how to make these tables attractive, by learning some CSS myself. They are pretty hideous right now, even if reflow was working!
Thanks,
Emily