サイトの中心線がずれている際のoverflowでの対応

railsでのWEBアプリを作成中

WEBアプリ作成時に項目の設置位置が左右均等でない位置がしばしばあった。

どうやらサイト右側のスクロールバー分の大きさだけずれてしまっている箇所が見受けられる。

そんな場合の調整を探っている際にoverflow-x overflow-yのcssの存在を知る。

●overflow

overflow-x :ボックスに収まらない内容の水平方向の表示方法を決める

overflow-y : ボックスに収まらない内容の垂直方向の表示方法を決める

●表示方法

auto :ブラウザの設定に依存

visible: 内容がボックスからはみ出して表示される

hidden :ボックスに収まらない内容は表示されず

scroll :ボックスに収まるか関係なく、スクロールバーが表示される

今回はbody要素に以下のプロパティ設定で解決済。

body {

overflow-x: hidden;

overflow-y: scroll;

}