中央揃えの DIV がスクロールバーによって移動されないようにするにはどうすればよいですか?

スクロールバーによる Web ページの位置変更の防止

Web サイト内に中央揃えの DIV を組み込む場合、特定のページにスクロールバーが存在すると、視覚的な違和感を生み出します。ユーザーがスクロールの必要がある場合とない場合にページ間を移動すると、スクロールバーの表示により配置が乱れ、ページがわずかに横に移動します。この問題は、すべてのページにスクロールバーを明示的に表示しなくても解決できます。

解決策:

スクロールバーがページの位置を変更しないようにするには、overflow-y プロパティを適用する必要があります。 へタグ。この方法により、コンテンツがビューポートの高さを超えた場合にのみスクロールバーがアクティブになります。

html {
  overflow-y: scroll;
}

このスタイルを に適用します。

をターゲットとするため、この要素は非常に重要です。要素を使用すると、Internet Explorer 7 に二重のスクロールバーが表示されることがあります。HTML ドキュメントを垂直にスクロールする必要があることを明示的に示すことで、スクロールバーはコンテンツから独立し、ページの配置が維持され、予期しないシフトが回避されます。

以上が中央揃えの DIV がスクロールバーによって移動されないようにするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。