我最近做了一个快速的投资组合网站，我仍然在调整过程中，但是我使用了一个可疑的网格，当我使用浏览器调整它的尺寸时，它看起来仍然看起来我希望它看起来如何。我本质上有三个断点，一个用于浏览器，一个用于平板电脑，一个用于手机。
唯一的问题是，当我将它加载到我的手机上时（HTC Desire），缩放似乎已经关闭了，它的大小就像中间断点（平板电脑）一样。
我设定的休息时间是：
$break-medium: 30em $total-columns;
$break-large: 60em $total-columns;
网站为here
我也注意到当你放大网站时，你需要水平滚动，这是我想要避免的！实际上Susy网站也没有这样做。
答案 0 :(得分：2)
这实际上与Susy没有任何关系，也没有让你的断点正确。默认情况下，移动safari的视口宽度为980px，因此它可以处理非移动设备友好的站点。如果您已经构建了适合移动设备的网站，则必须让Safari知道。例如，请参阅automatic zoom on iphone safari。你可能想要这样的东西：
<meta name="viewport" content="width=device-width, initial-scale=1">
答案 1 :(得分：0)
卡丽，
我不知道您的HTC Desire的分辨率 - 但是我使用的一个工具来检查响应式设计的“断点”的正确分解是这样的：
http://www.josscrowcroft.com/2011/code/window-size-bookmarklet/ https://github.com/josscrowcroft/Window-Size-Bookmarklet
这是一个发布视口大小的小书签。在使用谷歌浏览器的Mac上，我发现这个数字与滚动条宽或类似的像素大小相同“关闭”。所以它并不完美 - 但它确实有助于排除问题。
我会看看你的em是否与你的预期像素宽度相匹配，看看它是否与你的HTC相匹配 - 同时EM也可能会被搞砸（浏览器设置，你的html对象没有正确的设置等）。您可以尝试通过将其设置为固定像素宽度进行测试来测试，然后再次为em（s）完成所有数学运算。
我不确定这是否有帮助，但至少你现在还有另外一个工具选择（如果你已经不知道这个了;）
祝你好运＆amp;干杯， -Jeremy