2019年2月3日ツイートシェアB!はてブポケットPCサイトのレスポンシブ化で横揺れ(水平スクロール)させないポイントを3つ紹介します。おわりレスポンシブ化のチェックリスト要素の幅はMax100%最大幅を100%にしないと、画面からはみ出ても表示され続けてしまいます。auto;とセットで覚えるようにしましょう。100%;にしてもはみ出すことがあります。これは、padding、border、marginのいずれかが影響している可能性が高いです。レスポンシブデザインでは、基本的に左右のmarginは指定しないこと(親要素のpaddingで調整する)そして、widthの大きさをpaddingとborderを含んだ値にすることが大切です。borderーbox;を指定することではみ出す確率を下げることができます。rgba(0,0,0,.2);左右のpaddingの20pxと、左右のborderの4px分、はみ出す。100%;の中にpaddingとborderが内包されるので、はみ出さない。区切れない英字は折り返すHTMLは単語の途中では折り返さない仕様となっています。*/単語を折り返さないまま画面を突き抜ける。break-all;単語の途中でも折り返してくれる。@haniwa008Web屋としてスマホサイトの横揺れはとてもダサいです。技術力のなさを露呈している感じがして、指摘されるととても恥ずかしくなります。横揺れはユーザーにとっても大きなストレスとなります。リンクこのページが役に立ったらいいね!お願いします運営の励みになります...。同じカテゴリーの一覧を見る次の記事テキストをクリップボードにコピーできるjQueryプラグイン「clipboa...前の記事コーダー歓喜!WordPressのエディタ編集が便利になるプラグイン「HT...はにわまんWordPressが好きなフリーのWebコーダー。300件以上のWordPressカスタマイズを対応してきました。