2017-05-11 13 views
0

私は、ワードプレスのブログ用にフルページの視差画像ヘッダーを作成しています。ヘッダーイメージに次のスタイルを適用しました(開発ツールでCSSクラスを調べてCSSクラスを見つけました)。Wordpress - 背景画像のカバーを100%のビューポートの高さにします。

.header { 
    background: no-repeat center; 
    background-size: cover; 
    -moz-background-size: cover; 
    -webkit-background-size: cover; 
    height: 100vh; 
    margin: 0; 
    background-attachment: fixed; 
    position:relative; 
} 

この画像を適用した後でも、画像を下にスクロールすると画像の下に空白が表示されます。ここに問題が表示されます:http://bakemachine.com/travel/

どうすればこの問題を解決できますか?私はヘミングウェイのテーマを使用していますし、WordPressの開発に新しいです。前もって感謝します!

+0

Chromeバージョン58ここではファイン、これは視差をスクロールダウンした後 – Morpheus

+0

を動作するように想定どの視差で、画像とナビゲーションの間に白のギャップがあります。私はそれを調べ、そのイメージ内容。私はその白い隙間を取り戻したい –

答えて

1

.section-innermarginルールを書き換えるだけで、画像の隙間を取り除くことができます。このクラスはナビゲーション内にあります。

.section-inner { 
    width: 1040px; 
    max-width: 86%; 
    margin: 0 auto; // this rule is changed 
} 
関連する問題