Html 表中的字体在移动浏览器上呈现不一致

我目前正在创建一个桌面站点（），我希望能够与移动浏览器很好地配合使用，以减少创建单独移动站点的需要。Mobile safari似乎可以放大大块文本的字体（这很好）。问题在于我用于内容而不是布局的表。宽列中的字体将放大以使其可读，而小宽度列中的字体将被忽略

我当前一致呈现表的解决方法是：

@media only screen and (max-device-width: 480px) {      
    #container td { -webkit-text-size-adjust:100% }}

它对以下页面非常有效：

但对于包含事件详细信息的表（如：

在后一种情况下，我更希望将所有字体放大，以便页面保持一致，而不仅仅是右边的列

有没有办法做到这一点

非常感谢您的帮助

---

谢谢，Dougie:）

在页面的

部分添加一个视口标记，它将有助于防止设备缩放/缩放，并为您提供跨移动设备的统一外观

<meta name="viewport" content="width=device-width, initial-scale=1.0" />

你的脑袋里有元视口标记吗？没有。我应该有吗索凯，我刚做完。它现在只在点击链接时显示屏幕的左上角，但mobile safari仍然会不一致地缩放表格中的字体。我猜这是因为它是固定宽度的布局，而不是完全响应的设计……是的，如果你要进行跨平台外观，你必须进行完全响应的设计，%s ems而不是固定的PXL（&E）