気まぐれ ＆ 気まま ＆ 天邪鬼な老いぼれ技術屋の日々の記録のうち、主に Perl・CGI・HTMLなど Web技術に関連した記事です。
右端上端の同一カテゴリージャンプボタンで他の同じカテゴリーの記事を順番にご覧いただけます。
右端上端の同一カテゴリージャンプボタンで他の同じカテゴリーの記事を順番にご覧いただけます。
Access Counter: 
| -1597- 狭い話：続きの２ |
|
つまらない話が続いて恐縮だが、個人的防備録なので。 この e日記のデザインを変更して、そのテンプレートを公開しようと専用のページをアップした。概ね出来たんだが最後に確認するとスマホの表示でまた幅がピッタリハマらないでヘッダー部分の幅がかなり伸びてしまった。本体部分はピッタリハマってスクロールが必要ないのにスクロールが出来てしまう。パソコンでブラウザの幅を狭めても問題ないのに、スマホだとブラウザの幅は変えようがない。更にスマホのブラウザにはパソコンのブラウザのような「検証」ツールがない（多分開発者は使っているんだろうけど）。 カットアンドトライで問題を切り分けたところ、途中に入れたcss/js/html などのコード部分を<pre> ～ </pre> で囲んで改行などをさせないようにしたところ、パソコンで表示させた時は領域の右端を突き抜けて表示されるものの他の要素には影響しなかったのに、スマホだと画像サイズが表示要素の幅以上の時と同様で <body> 幅以上の表示と解釈されてしまい、width="100%" で指定した要素は一番長いコード幅分の表示となってしまうようで、必要のないスクロールが出来てしまう。 解決策は <pre style=" overflow: scroll;"> または autoを入れてその要素にスクロールバーを表示させること。もちろん改行を許可しても良いんだが。 今日の写真は多分 ハクチョウゲの花。 5月初めに写真撮った時は咲き始めで花の数が少なかったが、最近は花がビッシリ付いている。 |
|
2016/05/09 |