【ブログ】モバイルユーザビリティのためのpreタグ用CSS【コンテンツの幅が画面の幅を超えています】

【ブログ】モバイルユーザビリティのためのpreタグ用CSS【コンテンツの幅が画面の幅を超えています】

はじめに

コジマです。

あぁ~~つらいよぉ~~

エンジニアブログをやってる手前ソースコードをpreタグに書くことが多いんですけど、
横スクロールが出るとこのように怒られちゃうんですね。。。

このCSSを当てることにしました。
https://stackoverflow.com/questions/17496023/having-trouble-with-pre-code-on-mobile

pre, code, kbd { -moz-tab-size:4; -o-tab-size:4; tab-size:4; }
pre { white-space:pre-wrap; word-wrap:break-word; overflow:auto; }

横幅超えたら折り返すし、縦幅超えたらスクロール出すね。
というCSSです。

これで私の場合はとりあえずなんとか大丈夫。

さいごに

サーチコンソールのエラーほっとくとSEOにも影響しちゃうので時々見てあげないとですね。。
最近急にアクセスが落ちてたので焦る。。。

ブログの友よお互い頑張りましょう。

この記事を面白いまたは役に立ったと思ってくれた方は是非私のTwitter(@kojimanotech)を
フォローしてくれたらうれしいです!

以上、コジマでした。


WordPressカテゴリの最新記事