2016-05-26 5 views
1

20ページのグリッドにフルサイズとフルハイト、流体が入るようにしようとしています。CSS:流体フルページグリッドを実現しようとしています(スクロールが必要ありません)

これまでのところ、20項目、全幅、流体でページを構成しました。残念ながら、グリッドのコンテンツは、ナビゲーションバーの高さ(80ピクセル)だけ押し下げられています。私は今垂直スクロールを排除することができる唯一の方法は、具体的には、ナビゲーションバーの負の高さによってグリッド部をオフセットすることによってである:

.negative-navbar-offset { 
    margin-top: -80px; 
} 

この方法の明らかな問題であることをそれぞれの頂部最初の行の項目がナビゲーションバーの背後に隠れてしまっています。

問題のページはここで見ることができます:http://159.203.231.192/about/

これまでのところ、私が試した:

  1. HTML、ボディ= 100%に
  2. グリッド100VHのコンテナと100vw
  3. calc(100%〜80px)のグリッドコンテナ。

ヘルプ/ガイダンスをいただければ幸いです。ありがとうございました。 0:

答えて

0

ちょうどこのコードをチェックして、小さな画面でメディアを使用するために、それはデスクトップ表示のため

header.masthead.masthead-inline { 
    margin-bottom: 6em; 
} 

に役立ちますかどうかを確認

0

を照会この「.tg・グリッド・スライダー」のdivは、インラインスタイル(パディングを取ります2.5px)。パディングトップを設定した場合:80ピクセル。それが助けになるでしょう。 JSを介して高さを設定します。あなたがすでに行っていることです。

.tg-grid-slider { 
    padding-top:80px; 
} 
関連する問題