2016-03-20 37 views
0

私のスティッキーフッタを修復する必要があり、何らかの理由でこれが動作しています。なぜ私は分からない。私はここからの例に従っています: Bootstrap Sticky Footerスティッキーフッタが絶対位置で動作しない

私は自分のフッターの位置に追加しました:絶対;この例のページではこれは動作していて、フッターは同じ位置にとどまっていません。私はブラウザのサイズを変更します。しかし、私の例では、フッターは常に画面の下にとどまり、ポジションがどのように機能しているのか知っていますが、私の場合はポジションが例のように機能しません。私はWordpressとSageテーマをブートストラップ3で使用しています。ここでは例を見ることができます: My example page.

P.S.ここで

は、ページの本文のコードです:

<body <?php body_class(); ?>> 

    <!--[if IE]> 
     <div class="alert alert-warning"> 
     <?php _e('You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.', 'sage'); ?> 
     </div> 
    <![endif]--> 
    <?php 
     do_action('get_header'); 
     get_template_part('templates/header'); 
    ?> 

    <div class="wrap container" role="document"> 
     <div class="content row"> 
     <main class="main"> 
      <?php include Wrapper\template_path(); ?> 
     </main><!-- /.main --> 
     <?php if (Setup\display_sidebar()) : ?> 
      <aside class="sidebar"> 
      <?php include Wrapper\sidebar_path(); ?> 
      </aside><!-- /.sidebar --> 
     <?php endif; ?> 
     </div><!-- /.content --> 
    </div><!-- /.wrap --> 

    <?php 
    do_action('get_footer'); 
    if (!is_front_page()){ 
     get_template_part('templates/footer'); 
    } 
    wp_footer(); 
    ?> 


    </body> 

そして、ここでは、CSSです:

body { 
    margin: 0; 
    margin-bottom: 100px; 

} 

.biserka-footer { 
    background-color: #3b3b3b; 
    color: white; 

    width: 100%; 
    height: 13rem; 
    clear:both; 

    font-size: 0.8em; 

    position: absolute; 
    bottom: 0; 
} 
+0

あなたの投稿にコードを追加してください。助けを受ける機会が増えます。 – GillesC

+0

コメントありがとう、私はコードを追加しました。 – Mario

答えて

1

あなたは

.biserka-footer { 
    background-color: #3b3b3b; 
    bottom: 0; 
    clear: both; 
    color: white; 
    font-size: 0.8em; 
    height: 13rem; 
    position: fixed; /* fixed and not absolute */ 
    width: 100%; 
} 
(絶対ではない)固定positioを使用する必要があります

しかし、フッターを下部に置かない場合は、相対的な使用が可能です

.biserka-footer { 
    background-color: #3b3b3b; 
    bottom: 0; 
    clear: both; 
    color: white; 
    font-size: 0.8em; 
    height: 13rem; 
    position: relative; /* relati */ 
    width: 100%; 
} 
+0

Hm固定位置は、一番下のフッターになります。そして、私はコンテンツがフッターをプッシュし、コンテンツが画面全体を底にとどまらないならば。 – Mario

+0

フッターを下にしたくないのですか?確認してください。 – scaisEdge

+0

私はとにかく答えを更新しました – scaisEdge

関連する問題