0

スティッキーフッターを作成しようとしています。私はryanfaitsのバージョンとこれを見てみましたhttp://matthiasschuetz.com/content/extras/css_template01.html

最後の1つは問題なく動作しますが、問題は、content-divに多くのコンテンツを入力すると、フッターが下がり、content-divにスクロールバーがないことです。content-divで、min-height、max-height、height、そしてもちろんoverflow=autoとoverflow-yを設定してみました。最後の1つは、少なくとも無効になっているスクロールバーを示していますが、まだ機能していません。

何か案は？私はかなりイライラしています:(

どうもありがとう！ロン

4

3 に答える 3

2

ロン私も同じ問題を抱えていたので、はい、あなたの問題はスティッキーフッターで有効です。コンテンツが上から130pxで始まるコンテンツコンテナに次のように配置してみてください。

#content-container {
margin-top:130px;
position: absolute;
top: 0; 
bottom: 0; 
left: 0; 
right: 0;
overflow: auto;
}

私は実際にこれを行うことによってラッパーdiv全体をスクロールさせることになりました：

#wrapper {
min-height:100%;
height: auto !important;
height: 100;
margin: 0 auto;
position: absolute;
top: 0; 
bottom: 0; 
left: 0; 
right: 0;
overflow: auto;

}

#footer-container {
background-color:#263959;
color:#FFF;
height:110px;
min-width:1000px;
width:100%;
overflow:hidden;
position:absolute;
bottom:0;

}

于 2011-11-01T14:42:03.077 に答える
1

見て

http://www.cssstickyfooter.com/

http://matthiasschuetz.com/content/extras/css_template01.htmlを使用してコンテンツを展開すると、div のスクロールバーが表示されません。たぶん、html/css をオンラインに投稿して、これが役に立たない場合に人々が見ることができるようにする必要があります。

于 2011-08-27T11:42:50.880 に答える
0

まず、これを CSS に追加します。

html {
    height: auto;
    min-height: 100%;
    overflow-y: scroll;
}

第二に、私はあなたのスティッキーフッターを試しませんでしたが、私はこれをよく使用します http://ryanfait.com/sticky-footer/

これは非常にうまく機能します。

于 2011-08-27T11:44:24.977 に答える