サイトの横スクロールをできないようにする方法
cssのbodyに「overflow-x: hidden;」を指定する。
body{
overflow-x: hidden;
}
レスポンシブ対応のサイトを作っている時に右側に余白ができて困っていたところ、上記で解決しました！
※追記(2022/6/15)
現役エンジニアの方に上記のやり方はあまり好ましくないというご指摘をいただきました。
左右に空白ができてしまう問題を根本的な原因として、
・画面サイズよりもサイズの大きい要素が存在すること
があるそうです。
私の場合、Chromeのデベロッパーツールを使い、どの要素がはみ出してしまっているかを確認、調整すると全く左右にブレなくなりました！
（視覚的にはみ出していなくても、実際のサイズを確認するとはみ出しているものが見つかりました。）