html - フッターをページの下部に貼り付けることができません

Question

smiths-heimann.azは私のウェブサイトです。http://www.cssstickyfooter.com/からすべての手順を試しましたが、機能しません（http://smiths-heimann.az/?page=3が機能しないことを証明します）。ページの下部にスティックフッターを作成し、2つのdivの間の空の行を削除するのを手伝ってくださいhttp://prntscr.com/2e2fpThx 事前に

Answer 1

あなた#footerは中にい#wrapます。スティッキーフッターコードの外側 #wrapにフッターがあります：

<div id="wrap">
    <div id="main">
        <div id="content">
        </div>
        <div id="side">
        </div>
    </div>
</div>

<div id="footer">
</div>

編集

移動したフッターコードを使用してサイトを確認しました。下部にギャップがあります。これは、必要がない場合は、#footer'heightをフッターと同じにすることで解決できますmargin-topが、正の値になります。

他の問題に編集する

ヘッダー内には、、、およびのいくつかのクラスを含むナビゲーションがulありsf-menuます。それを脱ぐと隙間がなくなります。sf-js-enabledsf-shadowmargin-bottom: 1em

非伸縮性の背景の問題に編集

これはまだ非常に単純ですが、ヘッダーの透明度が少し変わります。

CSSファイルでbackground-imageforを見つけて、に移動します。明確にするために、このCSSが必要です。#container#wrap#wrap

#wrap 
{
    min-height: 100%;
    background: url("img/tff.png") 0 0 repeat;
}

そして#container、次のようになります。

#container 
{
    min-width: 980px;
    width: 100%;
    overflow: auto;
    padding-bottom: 110px;
}

非伸縮性の背景の問題に対する2番目の編集

Ok。ふぅ。やったよ; スクロールバーも削除しました。

作る#footer：

#footer {
    background: -moz-linear-gradient(center top , #FFFFFF, #EEEEEE) repeat scroll 0 0 transparent;
    border-top: 1px solid #919191;
    clear: both;
    font-size: 10px;
    height: 110px;
    margin-top: -126px;
    padding-top: 5px;
    position: relative;
    text-align: center;
    width: 100%;
}

境界線とパディングによってフッターの高さが増すため、スクロールバーが表示されていたため、負のマージンは実際には小さすぎました。に変更しました-116px。これはFirefoxで機能しますが、OPはChromeでは機能しないことを発見しました。最終的に、編集された画像を使用して、必要な機能を取得しました。この回答は参照としてのみ使用してください。

今これを作り#wrapます：

#wrap {
    background: url("img/tff.png") repeat scroll 0 0 transparent;
    height: auto;
    margin-top: 100px;
    min-height: 100%;
    position: relative;
}

最後に、.headerこれを作成します。

.header {
    background-image: url("img/nav/trans.png");
    color: white;
    height: 80px;
    top: -100px;
    padding-bottom: 10px;
    padding-top: 10px;
    text-align: center;
    position: relative
}

Answer 2

 margin-top: -150px;

そのCSSを失う