右表行向左下方行

时间:2017-07-28 06:26:15

标签: html

如果没有足够的空间,我希望右边的td(分页按钮)去左下方(按钮)。(小屏幕)。

可行吗?

<table cellpadding="0" cellspacing="0" border="0" width="100%" style="margin-bottom:3px">
<tr valign="bottom">
        <td class="smallfont"> "Buttons on Left </td>

    <td align="$stylevar[right]"> "Page navigation Buttons on Right </td>

</tr>
</table>

1 个答案:

答案 0 :(得分:0)

为表格添加一个额外的列并隐藏桌面。进入移动设备,隐藏第一列并显示第三列

&#13;
&#13;
 .hide-for-desktop{
    display:none;
 }
 
 .@media screen and (max-width: 500px) {
     
     table td{
        display:block;
        width:100%;
     }
     
     .hide-for-desktop{
        display:block
     }
     
     .hide-for-mobile{
         display:none !important;
     }
     
 }
&#13;
<table cellpadding="0" cellspacing="0" border="0" width="100%" style="margin-bottom:3px">
    <tr valign="bottom">
        <td class="smallfont hide-for-mobile"> "Buttons on Left </td>
        <td align="$stylevar[right]"> "Page navigation Buttons on Right </td>
      <td  class="smallfont hide-for-desktop"> "Buttons on Left </td>
    </tr>
</table>
&#13;
&#13;
&#13;