堀 浩一

Home About

   English

モバイル端末のための css <pre> と <code>

(老いぼれ人工知能研究者のプログラミング日記)

2019年7月14日

Google Search Consoleから、
「貴サイトに影響するモバイル ユーザビリティの新たな問題が 3 件検出されました。」
というメールが来ました。

「コンテンツの幅が画面の幅を超えています」
というのが主な問題でした。

これは、htmlファイルの中で、<pre> <code>を用いて、コードを記述していたからです。
コードの中に、長い行があって、モバイル端末のウィンドウからは、はみ出してしまっていました。

「html for mobile device pre code」というキーワードで検索してみましたら、次のページが見つかりました。
`having trouble with <pre><code> on mobile - Stack Overflow'

このページに載っている通り、cssを pre{white-space:pre-wrap; word-wrap:break-word; overflow:auto;} と変更してみましたら、私の場合もうまくいきました。


CC0
To the extent possible under law, the person who associated CC0 with this work has waived all copyright and related or neighboring rights to this work.




関連項目(自動計算):
FacebookボタンとTwitterボタンをきちんと並べる
WindowsのコマンドプロンプトでUnicodeを使う
Google検索の結果にfaviconを表示する
Ruby on RailsでURLをredirectする
WindowsからMacにVNCで接続しようとするとlogin windowが固まる
MeCabを使っていると、"'utf-8' codec can't decode byte 0xfa in position 0: invalid start byte" というエラーが起こる
WindowsでPythonを使う
長崎原爆の日
UAV/UGV Autonomous Cooperation
UNESCO: `Do you know AI or AI knows you better? Thinking Ethics of AI'
人工知能として認識されない人工知能の埋め込まれる社会に向けて
倫理的AIの設計を支援するためのAI
東京大学学術資産等アーカイブズポータル ー UTokyo Digital Collections
AI ELSI賞
AI(人工知能)と哲学
文化国家としての技術立国 ー 猪瀬博教授の思い出
映画「グリーンブック」を観て、年寄り人工知能研究者が考えること - 人種その他の差別とAI(人工知能)について
工学と理学の違い
堀 浩一 ホーム
文明と文化と科学と技術
堀 浩一
人工知能とは