*

AndroidでPCサイトを閲覧すると幅が狭まって余白ができる

   

実機(AQUOS PHONE 206SH)でPCサイトを検証したところ右側にボコっと余白ができる。

ググってるとAndroid4系で確認される現象だそうです。
ただ、現状では対症療法的な解決策しか見つけきれませんでした。
以下、方法です。

スポンサードリンク

■<P>タグのテキスト部分で余白が確認される場合
android
対象の<P>タグのcssに背景を指定する。

#contents p{ background-image:url(spacer.gif); }

画像名は何でもよいです。

このほかにviewportで調整するやり方もどうやらあるらしいですが、もろもろの事情で触りたくなかったので、背景指定の方にしました。
ただ、根本の解決策ではなく、応急処置としての解決策みたいです。
(でも他のやり方を見つけきれなかったので一旦これで。。)

参考サイト:
[実機未検証]Androidでp要素の幅が狭まる時の対応策
Android 4で改行位置が狂う
【Android】4系で幅が効かずに空白ができることがある件について

■<table>の幅が100%に広がらない
残念ながら、こちらまだ未解決です。
css上では設定してますが100%になってない。
inputタグが入ってるとこは幅が100%に広がるんですが、テキストのみの部分は広がらない。
けど、スマホ画面を横にすると100%に広がる。

なんか組み方とかに原因があるのかもしれません。。
まだ未解決なんですが解決策がわかったら追記すると思います。

【暫定解決策を追記】
とりあえずの解決策です。

1)<table>幅を100%指定ではなく、pxで指定する。
2)通常広がる部分(<td>とか)にbackgroundの指定。(←今回は適当に背景色を指定しました)

※原因はいまいち掴めてないのですが、上記2つの指定がないと幅いっぱいには広がりませんでした。
これもAndroidのバグになるんでしょうか?

 -Web

Sponsored link

Sponsored link

  関連記事

アナリティクスのフィルタで特定の国のアクセスを除外

1ヶ月ぶりの投稿になりますかね? 先日から、とあるキーワードでのアクセスが増えていたのですが、明らかに自分のブログの内容

no image

パララックスサイトを制作時に便利よさげなプラグイン「skrollr.js」

今回は少し触る機会があったのでパララックスを作るときに便利よさげなプラグインをご紹介します。 使用するプラグインは「sk

no image

モバイル用

wordpressのモバイル用。便利。でもdocomoとかで見れないので、そっちのプラグインはようわからん。 WPtou

no image

前回に引き続き、facebookページ作成の際の変更点などをメモ(2011年12月現在)

前回に引き続き、facebookページ作成の際の変更点などをメモ。 ■facebookページでスクロール非表示に使う「F

達人記念

iPhoneアプリの湯切り名人で達人とれたぞ記念。 さらに上には仙人とやらがあるらしい。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です


*

共働きの30代女性。
福岡でWebに携わってます。
主に自分用の細かいメモを書いてます。
細かい内容が多いですが、他の方にも役立つなら幸いです。

ブログの記事を紹介していただきました

このブログ更新するの、約1年ぶりか(汗) すごいお久しぶりです。 このブログを始めてもう地味に10年くらい経つのですが(

確定拠出年金、退職したときに行う手続き(継続するor掛金停止する)

私、昨年から確定拠出年金をしております。 会社には確定拠出年金の制度がなかったので、「個人型年金」の加入者として掛金の拠

実は先月で退職しました

だいぶブログさぼっておりましたが、実は先月末で会社を退職しました。 別にこの歳になって、自主退職したわけじゃないのです。

  • ブログランキング・にほんブログ村へ