我有问题了Android浏览器的自动调整功能。在我的网站的宽度会有点失控,当设备处于纵向模式。
我想要做的就是
有网站台式机和移动用户的相同版本。 允许用户放大和缩小,因为他们请。目前,我有我的头以下
< META NAME =视CONTENT =WIDTH = 1100>
我发现下面的博客文章,描述了我的问题。
这是肯定的自动调整布局造成的 (kLayoutFitColumnToScreen在Android的WebKit源$ C $ C)。只是 尝试测试与自动调整残疾,一切都呈现 正确的(至少我的Android设备上)。
Android上的自动调整模式似乎缩水某些元素的宽度 而不影响它们的定位,或其他的定位 元素。所以,如果你有一个包含块宽度:1000px和 跨越该宽度的100%文本中,容器可保持1000px 宽,但它里面的文本将换屏幕的宽度。
http://www.quirksmode.org/blog/archives/2009/09/css_width_unrel.html
有没有办法从踢制止这种自动调整模式?我不希望禁用变焦。
更新:
我还在寻找一个解决方案,如果有人知道一个。
发现有人用同样的问题(尽管他们使用的是表)
Spanned列崩于Android的网络浏览器(使用自动调整页面时)
http://$c$c.google.com/p/android/issues/detail?id=22447&can=4&colspec=ID%20Type%20Status%20Owner%20Summary%20Stars
解决方案我已经遇到这个问题,并找到了一个解决方案,为我工作。
我有一个主要的< DIV>
有一些嵌套的< DIV>
中的元素。的HTML是非常基本的。我发现有一个< DIV>在
我的主< DIV>
就好像我有双重包装其文本-tapped来放大它的文本。这< DIV>
只包含文本。发生这种情况仅在纵向和双攻或转换方向后更正。
由于这个问题是一个Android的错误,没有CSS或HTML才能真正解决这个问题。但是,下面的CSS解决了这个问题圆满我;我没有关闭自动调整页面:
我添加了一个CSS 背景图像
到< DIV>
。我只是用一个透明的,一个像素PNG作为背景。
DIV {背景图像:网址(../ IMG / blank.png); }
I am having problems with the auto resize feature of the android browser. The widths on my site are going a bit haywire when the device is in portrait mode.
What I would like to do is
Have the same version of the site for both desktop and mobile users. Allow the user to zoom in and out as they please.I currently have the following in my head
<meta name="viewport" content="width=1100">
I found the following blog post which describes my problem.
This is definitely caused by the auto-fit layout ("kLayoutFitColumnToScreen" in the Android WebKit source code). Just try the test with auto-fit disabled and everything is rendered correctly (at least on my Android device).
The auto-fit mode on Android seems to shrink certain elements' width without affecting their positioning, or the positioning of other elements. So if you have a containing block with width: 1000px and text that spans 100% of that width, the container may remain 1000px wide but the text inside it will wrap at the screen width.
http://www.quirksmode.org/blog/archives/2009/09/css_width_unrel.html
Is there a way to stop this autofit mode from kicking in? I don't want to disable zooming.
Update:
I am still searching for a solution if anyone knows of one.
Have found someone with the same problem (although they are using tables)
Spanned columns collapsing on Android web-browser (when using auto-fit pages)
http://code.google.com/p/android/issues/detail?id=22447&can=4&colspec=ID%20Type%20Status%20Owner%20Summary%20Stars
解决方案I have been experiencing this problem and found a solution that works for me.
I have one main <div>
with some nested <div>
elements inside. The HTML is very basic. I found that one <div>
within my main <div>
would wrap its text as if I had double-tapped the text to zoom in on it. This <div>
only contained text. This behavior occurred only in portrait orientation, and it corrected after double-tapping or switching orientation.
Since this problem is an Android bug, no CSS or HTML can really fix it. However, the following CSS resolved the problem satisfactorily for me; and I didn't have to turn off "Auto-fit pages":
I added a CSS background-image
to the <div>
. I just used a transparent, one-pixel PNG as the background.
div { background-image: url(../img/blank.png); }