不正确的宽度在Android的WebKit浏览器不正确、宽度、浏览器、Android

2023-09-05 10:37:10 作者:浊泪临窗滴

我注意到了Android的默认浏览器,其中100%的宽度实际上可能晃过屏幕边缘的问题。这里有一个最小的测试案例:

I noticed a problem on Android's default browser, where 100% width may actually go past the edge of the screen. Here's a minimal test case:

  <div class='separator' width=100% style='border: 2px;padding: 2px;border-style: solid;'>&nbsp;</div>
  <div class='separator' width=100% style='border: 2px;padding: 2px;border-style: solid;'>New & improved div</div>
  <div class='separator' width=100% style='border: 2px;padding: 2px;border-style: solid;'>another working one</div>
  <div class='separator' width=100% style='border: 2px;padding: 2px;border-style: solid;'>another</div>

这将按预期在桌面浏览器,但在Android的WebKit浏览器,第一个DIV去离开屏幕,放大和缩小时,不会改变宽度。之后的div正常工作。

This works as expected on a desktop browser, but in Android webkit browser, the first div goes way off the screen, and doesn't change width when zooming in and out. The divs after it work correctly.

更新:我已经在2.3测试过这一点,3.0,3.1,和一个新创建的2.2模拟器,他们都它正确失败的大小。它看起来像其他人都注意到了这一点,请参阅here 和here.任何人都知道一个很好的办法解决这个bug?

Update: I've tested this on 2.3, 3.0, 3.1, and a newly created 2.2 emulator, they all fail to size it correctly. It looks like other people have noticed this, see here and here. Anyone know a good workaround for this bug?

推荐答案

在我的WebView,我能够通过关闭宽视固定宽度。

In my WebView, I was able to fix the widths by turning off wide viewport.

webview.getSettings().setUseWideViewPort(false);

这将禁用水平滚动,除非绝对必要,和div宽度和变焦正常工作。显然,这不仅会与自定义的WebView工作,也许有一个更通用的方法来的东西,如:LT做到这一点; META NAME =视口...>

This disables horizontal scroll unless absolutely necessary, and div widths and zoom work as expected. Obviously this will only work with a custom WebView, maybe there is a more generic way to do this with something like <meta name="viewport" ...> ?