响应式移动模板上的视口宽度问题 [英] Viewport width issue on responsive mobile template

问题描述

我正在尝试将设计欠佳的模板转换为响应式设计，可在以下位置找到: http://www.crhinc.com/about-mobile.html

I am trying to convert a poorly designed template to a responsive design, found here:http://www.crhinc.com/about-mobile.html

在大小适合移动的桌面浏览器上，该模板看起来和工作正常，但在android和iphone上，页面大于视口时出现问题.我知道我一定会丢失一些东西，但是正如您所看到的，我已经概述了这些元素，只是为了尝试一下，看看是否可以找出其中的内容将其拉伸到视口之外并导致手机从一侧滚动到另一侧但不是台式机浏览器.

Im having an issue where on desktop browser sized to mobile the template looks and works great, but on android and iphone, the page is larger than the viewport. i know i must be missing something, but as you can see, i have outlined the elements just to get try and see if i can find out whats in there that is stretching it outside the viewport and cause mobile phones to scroll from side to side but not desktop browsers.

我将主体设置为300px宽度，只是为了查看是否可以找到流氓元素，但将其放回原处，因为它不起作用.内容中有几张桌子，但都设置为100％宽度.

i set the body up for 300px width just to see if i could find the rogue element, but put it back because it did not work. there are a few tables in the content, but all set to 100% width.

由于某种原因，它看起来几乎像是台式机和手机上的宽度，或者实际上并不相同.

for some reason, it almost looks like the width in the desktop and on mobiles or not actually the same.

杰夫

推荐答案

您是否真的认为它是视口?您是否为视口设置了正确的内容?

Do you actually think it is the viewport? Do you have the viewport set with the right content?

也许此链接可能会有所帮助.

还是CSS?在那种情况下，我建议您搜索width之类的.试图找到大数字.

Or is it just the CSS? In that case I would recommand you searching for width and such. Trying to find big numbers..

设置指定的宽度应该用于指定的屏幕尺寸.否则将其设置为最大宽度.

Setting a specified width should be for specified screen sizes. Otherwise make it max-width.

这篇关于响应式移动模板上的视口宽度问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！