2

まず、自分に関連するトピックを調べましたが、問題は解決しませんでした。

そして、私の問題は何ですか?position : absolute&を使用bottom : 0して、フッターをページの下部に貼り付けました。しかし、その上にウィジェットのセットがあります! フッターが重なっています。以前float : leftはウィジェットを一列に並べていました。フロートをクリアしようとしましたが、うまくいきませんでした。ここでは、その特定のコード スニペットとスクリーンショットを提供します。

コード スニペット : http://codepen.io/tabibzadeh/pen/AvCow * CSS が LESS の下にあることに注意してください

スクリーンショット

どうもありがとうございました :)

4

7 に答える 7

1

この種の問題で私を本当に助けてくれたウェブサイトは次のとおりでした:http ://www.cssstickyfooter.com/

うまくいけば、それはあなたの問題を解決するでしょう。

于 2013-03-06T15:55:50.800 に答える
1

問題を解決しました。ご尽力いただきありがとうございます。ポジショニングは必要ありませんでした。相対、絶対など。解決策はclear:both、フッター クラスに a を追加して適用することでした。margin-top

グッドラックバディ。

于 2013-03-07T15:39:54.987 に答える
1

あなたの努力と答えに感謝します。

私はあなたのアイデアを試していて、何か新しいものを思いつきました。上記のように、絶対配置を削除して相対配置を適用しました。次にmargin-top : 400px、フッターセクションを押し下げるとうまくいきました!しかし、それが良い解決策であるかどうか疑問に思っていましたか?

再度、感謝します。

于 2013-03-06T16:39:25.063 に答える
0

フッターの高さを補正するために、ボディの下部にパディングを追加するだけです。

body{
     padding:0 0 60px;
}

フッターが絶対に別のコンテナー内に配置されている場合は、代わりにそのコンテナーにパディングを追加する必要があります。

于 2013-03-06T16:17:40.417 に答える
0

position:absoluteフッターをページの下部に貼り付けるために使用する必要はありません。フッターをブラウザウィンドウの下部に貼り付けたい場合は、を使用できますposition:absolute。ただし、コンテンツの高さがブラウザウィンドウの高さよりも長く、コンテンツの上にフッターがあるため、発生しているコンテンツと重複する可能性があります。それはあなたがそのようにフッターを配置することによってあなたが期待したことです。

于 2013-03-06T16:00:32.607 に答える
0

The position:absolute; is forcing your footer on top of your other div's, because you're placing it "absolutely" on said position. Namely; bottom:0. It doesn't care if there's other elements.

Positioning with position:relative; should easily fix this problem.

http://webdesign.about.com/od/advancedcss/a/aa061307.htm

于 2013-03-06T15:54:26.647 に答える
0

これは予想される動作ですposition: absolute-- 要素は、ページ上の他の要素を考慮せずに絶対的に配置されます。要素を他の要素に対して相対的に配置したい場合position: relativeは、(デフォルト値) を使用します。相対配置を使用する場合、親要素と周囲の要素がスタイリングに影響することに注意してください。

于 2013-03-06T15:55:23.127 に答える