0

開発中の Web サイトで問題が発生しています。ウィンドウのサイズを 1170px 未満の水平解像度に変更すると、ナビゲーション バーとフッターの両方でページの右側に隙間ができます。サイズ変更されたウィンドウ 全画面表示 これは、モバイル ブラウザーでも発生します (ナビゲーション バーでズームインすると右に移動し、最後のオブジェクトに到達できなくなります)。この問題を解決するのを手伝ってくれませんか?

HTML: http://pastebin.com/nTW3MrEr CSS: http://pastebin.com/v1TDiK6J フッターの問題 (ウィンドウのサイズ変更、ヒーロー ユニット/navbar/およびコンテンツは問題ありませんが、フッターはまだ問題があります。問題をよりよく理解するためのテキスト:ここに画像の説明を入力

4

1 に答える 1

1

Web サイトの問題は、min-width:1100px が hero-unit に設定され、width:1170px が div #corpo に設定されていることが原因です。コンテナ クラスを使用してコンテンツをラップしているため、ブートストラップ レスポンシブ CSS の幅はすでに 1170px であるため、そこに設定する必要はありません。

また、レイアウトが適切に表示されるように再配置するには、ページの特定のセクションに対してメディア クエリを記述できます。タブレット ビューのページでは、ナビゲーションとページ ヘッダーの間に大きな余白があるため、以下のように配置できます。

/* Landscape phone to portrait tablet */
   @media (max-width: 767px) {
     .navbar-fixed-top{
        margin-top:5px;
             }
     .page-header{
          margin-top:5px;
           }
      }

/* Landscape phones and down */
   @media (max-width: 480px) {
          .navbar-fixed-top{
        margin-top:5px;
             }
     .page-header{
          margin-top:5px;
           }

       }
于 2013-03-09T13:15:10.760 に答える