2023年2月26日日曜日

スマホではみ出すホームページ

 一見スマホ用になっているページでも、よく見ると画面外にはみ出していることがある。


「ファミコンのネタ!!」

時にジャーナリズムの域に達している記事もある老舗サイト。
よく見る故に気になるのかも。


まずはトップページ。一見問題ないように見えるが・・・


ページが左にスワイプできてしまう(右にはみ出している/余白がある)。


原因は何か?ページを下にたぐると「About」の箇所がはみ出していることがわかる。
(複数の機種、複数のブラウザで確認済み)

どうやら、tableのwidthを500に設定しているのが原因の模様。
なぜそんな値にしてしまったのか・・・


webmとmp4の違いについて解説したブログ記事

検索していて発見したページ。
一部が派手にはみ出していることがわかる。
非常によくあるパターンだ。

これは、件の箇所のpをwidth810のdivで囲んでいるのが原因。

PC表示の時に「詳しくはこちら」と左右に並べて表示するために記述したと思われるが、それが仇となった。

このような例は枚挙に暇がない。ついつい直したくなってしまう性。

0 件のコメント:

コメントを投稿