Pertanyaan Lebar salah dalam browser webkit Android


Saya melihat ada masalah pada peramban bawaan Android, di mana lebar 100% sebenarnya dapat melewati tepi layar. Berikut ini uji coba minimal:

  <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>

Ini berfungsi seperti yang diharapkan pada browser desktop, tetapi di browser webkit Android, div pertama berjalan jauh dari layar, dan tidak berubah lebar saat memperbesar dan memperkecil. The divs setelah bekerja dengan benar.

Memperbarui: Saya sudah menguji ini pada 2.3, 3.0, 3.1, dan emulator 2.2 yang baru dibuat, semuanya gagal untuk mengukurnya dengan benar. Sepertinya orang lain telah memperhatikan ini, lihat sini dan sini. Ada yang tahu solusi yang baik untuk bug ini?


9
2018-06-23 21:32


asal


Jawaban:


Cukup tambahkan tag meta ini di dalam tag kepala html Anda. Saya sudah memeriksanya dengan browser 2,1 android dan berfungsi dengan baik di zoom.

<meta name="viewport" content="width=device-width" />

10
2017-07-05 06:27



Di WebView saya, saya dapat memperbaiki lebar dengan mematikan area pandang lebar.

webview.getSettings().setUseWideViewPort(false);

Ini menonaktifkan pengguliran horizontal kecuali benar-benar diperlukan, dan lebar div dan zoom berfungsi seperti yang diharapkan. Tentunya ini hanya akan bekerja dengan WebView custom, mungkin ada cara yang lebih umum untuk melakukan ini dengan sesuatu seperti <meta name = "viewport" ...>?


1
2017-07-06 05:59



menggunakan

layout_width="fillparent"

:)


0
2017-07-08 08:09