移动设备上网页布局失败的原因是什么？

在移动设备上布局失败的原因

在电脑端正常显示的布局，切换到移动设备后出现故障，通常原因如下：

Flex 属性范围问题

从提供的代码中，可以在 .cards 上看到 flex 属性的设置。然而，flex 生效范围基于副属性。这意味着当在 .cards 上设置 flex 属性时，其作用范围只在 table 层级，而不会影响到 tr 或 td 层级。

移动端宽度未定义

在电脑端，页面可以正常显示是因为设置了 cellspacing="19px"，导致 td 单元格间距为 19px。然而，在移动端却没有设置 td 的宽度，导致它们默认占据了 100% 的宽度，从而导致布局失败。