web-dev-qa-db-ja.com

Wordpress Uniteテーマ:フターがくっつかない

私のフッターがページの一番下、つまりすべてのコンテンツの下に表示されない理由をトラブルシューティングしようとしているという点で、私は何もしていません。

私のテーマはUniteです。オンラインではないので、リンクを張ることはできません。

これは最も理にかなっていますが、それがフッターIDであるため、これを「colophon」に差し込むことは機能しませんでした。

http://matthewjamestaylor.com/blog/bottom-footer-demo.htm

私はCSSを提供することができます:

 #colophon {

position: absolute;
    bottom: 0;
    width: 100%;
    height: 75px;
    /*padding: 10px 0;*/
    margin-top: 5px;
    left: 0;
    background-color: #303b23;
}

.footer-nav.nav > li > a:hover {
  background-color: transparent;
}

@media (max-width: 767px) {

    .site-info, .copyright {
      text-align: center;
    }
    .footer-nav.nav, .copyright {
        float: none;

    }
    .carousel-caption {
        display: none;
    }
}

/* Clearing */
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
    content: '';
    display: table;
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
    clear: both;
}

私はこれで数週間、オンとオフを繰り返してきましたが、成功していません。誰でも手伝うことができますか?

これを解決するためにさらに情報を追加する必要がある場合は、お知らせください。

どうもありがとうございます!

1
MJV

#colophonはあなたのフッターラッパーの要素IDだと思いますか?これはフッターラッパーにとってはちょっと変な名前ですが、それでいいのであれば大丈夫です。

position: absolute;は、ビューポートではなく、包含要素を基準にしています。

簡単な解決策として、これをあなたのCSSに追加してみてください。

html, body {
    height: 100%;
}

それでもうまくいかない場合は、フッターのチェーン内に高さ100%ではない先祖の要素があります。実際に何が起こっているのかを確認するには、DOMインスペクタ(たとえばFireBug)にページを配置する必要があります。

0
C C