mania-ku

何か作りたいプログラマ未満。

【Android】4系で幅が効かずに空白ができることがある件について

このバグですが、現象としては下記のときに起きるみたい

  • ・Android4系のみ(4系でもGALAXY S III SC-06D起きないっぽい)
  • ・pタグでテキストのみ

対処法としては、二種類あります

  • ・バグが起きた要素に背景色・背景画像を指定
    (ただし、display:tableやdisplay:table-cellなんかだと効かない)
  • ・viewportの指定でなんとかする(PCサイト用だと下記コードの要な感じで)
(function(){
var agent = navigator.userAgent;
if (agent.search(/Android 4/) !== -1) {//Android4系のみ。下位バージョンで効くとバグが起きる
$("head").append($('<meta name="viewport" content="width=device-width,user-scalable=yes,target-densitydpi=device-dpi,initial-scale='+(screen.width/***)+'">'));
//***のところは、コンテンツのサイズを入れる
}
});

なぜかこのバグぐぐってもあんまり対処法が見つからない・・・気づいている人が少ないのか、それとも4系まだ少ないから?いろんなサイトで起きているみたいですが・・・

参考:
[Android][css] 「ページの自動調整」でデザインが崩れる
Android4.0端末で右側に空白ができちゃう系トラブル
Android 4で改行位置が狂う | count0.org

Pocket
LINEで送る