html – 如何在响应式电子邮件中使表格堆叠在左边？

概述所以这是我的第二个响应式设计电子邮件,所以我被卡住了. 在移动设备上查看时,我有2个桌子正在尝试堆叠.以下是2个表格在桌面模式下的显示方式： | 1 | 2 | 在移动设备上查看时,我希望表格显示为： | 2 || 1 | 我试过浮动表并使用position：fixed！important但我无法获得所需的效果.任何帮助或指导将不胜感激. 我在 another solution中 所以这是我的第二个响应式设计电子邮件,所以我被卡住了.

在移动设备上查看时,我有2个桌子正在尝试堆叠.以下是2个表格在桌面模式下的显示方式：

|  1  |  2  |

在移动设备上查看时,我希望表格显示为：

|  2  ||  1  |

我试过浮动表并使用position：fixed！important但我无法获得所需的效果.任何帮助或指导将不胜感激.

解决方法 我在 another solution中尝试了一种方法.

您可以使用dir =“rtl”来控制列的堆叠方式.这是一个例子：

<table  dir="rtl"  wIDth="100%" cellpadding="0" cellspacing="0" border="0" >  <tr>    <td wIDth="50%" dir="ltr" align="right" >      <p >      <a href="#"><img src="http://placehold.it/440x440&text=RIGHT" alt="" border="0"  /></a>       </p>                      </td>    <td wIDth="50%" dir="ltr" align="left" >      <a href="#"><img src="http://placehold.it/440x440&text=left" alt="" border="0"  /></a>                          </td>  </tr></table>

结合@media查询：

@media only screen and (max-wIDth: 640px)  {  .full {    display:block;    wIDth:100%;  }}

这是完整的jsFiddle.

总结

以上是内存溢出为你收集整理的html – 如何在响应式电子邮件中使表格堆叠在左边？全部内容，希望文章能够帮你解决html – 如何在响应式电子邮件中使表格堆叠在左边？所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。