1

基本的に、ブラウザのサイズを変更すると、幅 100% の Div ラッパーが正しく機能しません。ブラウザーのサイズをページのデザインよりも小さくすると、水平スクロール バーが表示されますが、実際には全幅ではありません。ある時点でちょうど切れているようなものです。

ここにリンクがあります：ウェブサイトリンク

私はこれを修正しようとしましたが、なぜこれが起こっているのか本当に混乱しています. 誰でもこの問題に光を当てることができますか?

前もって感謝します。

マーク

4

2 に答える 2

4

私はそれを考え出した！width: 100% を min-width: 100% に設定すると、問題が修正されます。

于 2013-01-14T11:09:36.103 に答える
1

.wrap div の幅は 1050px に固定されているため、ページの最小幅も 1050px に強制されます。これが、ブラウザ ウィンドウの幅が 1050px 未満の場合にスクロールバーが表示される理由です。

.wrap {
  position: relative;
  margin: 0 auto;
  width: 1050px;
}

margin:0 auto;ただし、コンテンツを中央に配置するために固定幅の div が必要なため、この幅が固定されているのには理由があります。

より狭い画面に合わせてデザインを縮小したい場合は、CSS メディア クエリを使用して、さまざまなブラウザー/デバイス幅用の代替ルールを作成することを検討することをお勧めします。

このデモのサイズを変更して、意図したとおりに動作するかどうかを確認してください。そうであれば、チュートリアルを実行してください。

Smashing Magazineには、特にモバイル デバイス用の別のレイアウトを探している場合に役立つ、優れたメディア クエリのチュートリアルもあります。

于 2013-01-06T13:37:22.207 に答える