css - スクロール バーを削除しますが、前後のコンテンツはクリップしませんか?

Question

:before と :after を使用して、メイン コンテンツ ブロックの外側にいくつかの要素を作成しています。幅:100% であるため、ブラウザーの全長を埋めます。

残念ながら、彼らは私が望んでいない画面の下部にスクロール バーを追加します。overflow:hidden を使用すると、スクロール バーは表示されますが、デザインが切り取られ、サイトの両側のコンテンツが失われます。

何か案は？

Answer 1

要素の幅の合計は、本体の幅の 100% + 100% = 200% (ここでは推測しています) になり、メイン コンテンツ ブロックの幅を追加します。これが、水平スクロール バーが表示される理由です。

一般的な提案として、コードを jsfiddle.net に投稿して、見て遊んでみることをお勧めします。