HTML 和 CSS 表格在 Android Firefox 中显示完美，但在 Android Chrome 中不完美答案

【问题标题】：HTML & CSS tables showing perfect in Android Firefox but not in Android ChromeHTML 和 CSS 表格在 Android Firefox 中显示完美，但在 Android Chrome 中不完美
【发布时间】：2021-03-31 16:08:37
【问题描述】：

这个 HTML 和 CSS 内容表在桌面 chrome 和 firefox 中完美显示，但是当我在 android chrome 浏览器中打开它时，表格的右侧没有正确显示，但在 android firefox 浏览器中运行良好。在 chrome 中一切正常，但仅在 android 8.0 版本中。问题仅在android 10版本中。 Chrome 已更新。

Check the HTML&CSS at codepen. 
 https://codepen.io/Zeeshanelahi/pen/GRrrNNv

Firefox View Chrome view

【问题讨论】：

请在问题本身中提供所有相关代码，而不仅仅是在外部网站上。还请阅读提供给您的错误消息并遵循其中给出的建议，而不是绕过它们。
您在测试哪个模型？我在 browserstack.com 上测试了 Pixel Android 8，但无法重现您的问题。
stackoverflow.com/questions/47742580/…
将<meta name="viewport" content="width=device-width, initial-scale=1.0"> 添加到您的html 的<head> 部分，然后检查结果。

标签： html css css-tables

【解决方案1】：

您的这个问题主要与响应能力有关。 Responsiveness 是网站或 Web 应用程序的一项功能，可以适应不同的显示器（在大小方面），以便容器的内容保持其初始位置、大小、吸引力等。

在您的情况下，如果您的表格没有响应，您可以仅在特定时刻（Android Chrome）修复问题，它会在其他各种浏览器或显示器中继续显示不相关的行为。

响应性主要是通过将动态值分配给大小调整属性来实现的。与其给出某些静态值，例如 px，不如给出更动态的值，例如百分比 (%)、rem、em 等。

请考虑这一点，并尝试更全面地解决您的问题，使其具有响应性，这样您就不会遇到任何其他此类问题。如果您需要更多帮助，请联系我。

附：由于我没有足够的代表，我无法发表评论，不得不发布这个作为答案。

【讨论】：

我认为你解释了流畅的设计，没有响应，所以你投了反对票。见link.medium.com/JcSmP2My5eb
流体设计通常是响应式设计的一部分。准确地说，流体设计的主要因素是能够响应定义响应式设计的每一个屏幕尺寸变化的能力。 Medium 上的文章大多基于作者的个人观点，这意味着可能存在偏见。