Recommendations to make tables mobile friendly
Hello,
I have noticed on mobile our tables adapt really poorly, is there another option?
Currently we use code such as:
<table>
<thead>
<tr>
<th></th>
<th>KK-68 CH</th>
<th>KK-105</th>
<th>KK-190 CH</th>
<th>KK-340</th>
<th>KK-500 CH</th>
<th>KK-1000</th>
</tr>
</thead>
<tbody>
<tr>
<th>Volume</th>
<td>68L </td>
<td>105L </td>
<td>190L </td>
<td>340L </td>
<td>500L </td>
<td>1000L </td>
</tr>
<tr>
<th>Temperature Range</th>
<td>+5°C to +180°C</td>
<td>+5°C to +180°C </td>
<td>+5°C to +180°C </td>
<td>+5°C to +180°C </td>
<td>+5°C to +180°C </td>
<td>+5°C to +180°C </td>
</tr>
<tr>
<th>Relative Humidity Range</th>
<td>10% to 98%</td>
<td>10% to 98%</td>
<td>10% to 98%</td>
<td>10% to 98%</td>
<td>10% to 98%</td>
<td>10% to 98%</td>
</tr>
<tr>
<th>External dimensions (WxHxD)</th>
<td>650 x 1233 x 796mm </td>
<td>725 x 1560 x 845 </td>
<td>834 x 1675 x 930</td>
<td>835 x 1895 x 1115</td>
<td>1035 x 1810 x 1270</td>
<td>1235 x 1930 x 1495</td>
</tr>
<tr>
<th>Internal Dimensions (WxHxD)</th>
<td>410 x 475 x 350mm</td>
<td>490 x 498 x 430mm</td>
<td>600 x 610 x 510mm</td>
<td>600 x 830 x 685mm</td>
<td>800 x 800 x 800mm</td>
<td>1000 x 1000 x 1000mm</td>
</tr>
<tr>
<th>Max Capacity</th>
<td>40 kg</td>
<td>60 kg </td>
<td>80 kg</td>
<td>100 kg </td>
<td>150 kg</td>
<td>200 kg </td>
</tr>
<tr>
<th>Temperature stability</th>
<td>±0.05°C @ 50°C 50% Rh <br>±0.05°C @ 90°C 90% Rh</br> ±0.2°C @ 180°C</td>
<td>±0.05°C @ 50°C 50% Rh <br>±0.1°C @ 90°C 90% Rh</br> ±0.3°C @ 180°C</td>
<td>±0.06°C @ 50°C 50% Rh <br>±0.1°C @ 90°C 90% Rh</br> ±0.3°C @ 180°C</td>
<td>±0.06°C @ 50°C 50% Rh<br> ±0.1°C @ 90°C 90% Rh</br> ±0.2°C @ 180°C</td>
<td>±0.06°C @ 50°C 50% Rh<br> ±0.1°C @ 90°C 90% Rh</br> ±0.2°C @ 180°C</td>
<td>±0.05°C @ 50°C 50% Rh<br> ±0.1°C @ 90°C 90% Rh </br>±0.3°C @ 180°C </td>
</tr>
<tr>
<th>Temperature Uniformity</th>
<td>±0.3°C @ 50°C 50% Rh <br>±0.4°C @ 90°C 90% Rh</br> ±1.5°C @ 180°C </td>
<td>±0.3°C @ 50°C 50% Rh<br> ±0.4°C @ 90°C 90% Rh </br>±1.8°C @ 180°C</td>
<td>±0.4°C @ 50°C 50% Rh<br> ±0.4°C @ 90°C 90% Rh</br> ±2.0°C @ 180°C </td>
<td>±0.3°C @ 50°C 50% Rh <br>±0.4°C @ 90°C 90% Rh </br>±1.5°C @ 180°C</td>
<td>±0.3°C @ 50°C 50% Rh <br>±0.4°C @ 90°C 90% Rh </br>±1.6°C @ 180°C </td>
<td>±0.4°C @ 50°C 50% Rh<br> ±0.4°C @ 90°C 90% Rh</br> ±1.8°C @ 180°C</td>
</tr>
<tr>
<th>Wattage</th>
<td>3500</td>
<td>3200</td>
<td>3600</td>
<td>3600</td>
<td>9000</td>
<td>12000</td>
</tr>
<tr>
<th>Relative humidity stability (%) </th>
<td>±0.5% @ 50°C 50% Rh <br>±0.5% @ 90°C 90% Rh</br> </td>
<td>±0.5% @ 50°C 50% Rh <br>±0.5% @ 90°C 90% Rh </br></td>
<td>±0.5% @ 50°C 50% Rh <br>±0.5% @ 90°C 90% Rh </br></td>
<td>±0.6% @ 50°C 50% Rh<br> ±0.6% @ 90°C 90% Rh </br></td>
<td>±0.5% @ 50°C 50% Rh<br> ±0.5% @ 90°C 90% Rh </br></td>
<td>±0.5% @ 50°C 50% Rh <br>±0.5% @ 90°C 90% Rh </br></td>
</tr>
</tbody>
</table>
Comments
Hello,
Please, go to Betheme -> Theme options -> Global -> Advanced, and from HTML table dropdown menu, choose Auto Responsive.
After, check if the display is correct.
Thanks
Thanks again Phil,
I have done that and it has helped somewhat but on mobile tables that have more than 4 columns get cut off the screen and you can't seem to scroll across them. Image below as an example.
Sorry that screenshot is more cropped than it actually appears.. here is the link if you can view on mobile.
https://www.withnellsensors.co.uk/pages/products-and-services/data-loggers-thermocouples/senseanywhere-airosensor/
I can see that you do not have the newest version of Betheme.
Please, update it, and check if the problem persists.
Thanks