Q

アイソトープとブートストラップ3とスティッキーフッタ

2016-07-23 8 views 0 likes

0

アイソトープを使用して、ブートストラップ3フレームワーク内にイメージグリッドを表示しています。私はつまらないフッターを持っています（ボトムを0に設定して推奨絶対位置を使用）。アイソトープとブートストラップ3とスティッキーフッタ

ブラウザウィンドウの高さが低くなると、アイソトープ-dイメージを含むdivはスティッキーフッターが始まる場所で停止しないので、divの最下部の60ピクセル（実際の量はフッターに設定された高さによって異なります）フッターによって隠され、またはフッターの下に広がる。違いは、コンテナdivの高さを設定するかどうかによって決まります。ここで

はhttps://codepen.io/marklsanders/pen/KrRVaKからのHTMLです：

the codepen contains an example

私は問題は同位体により位置決めすべての画像が絶対的に配置されていることに起因する推測しています。これを正しく動作させる方法に関する提案はありますか？

おかげ

2016-07-23 Mark Sanders

A

答えて

0

はposition: fixed;にposition: absolute;から、あなたのフッターを変更してみてください、そして、あなたの<body>にpadding-bottom: 75px;を追加します。

絶対または固定を配置すると、その要素はドキュメントの通常のフローから削除されることに注意してください。それを配置すると、静的に配置された別の要素と競合する可能性が高くなります。

この場合、ボディにパディングを追加すると、通常のドキュメントでは実際にフッタによって占有される領域がシミュレートされます。

追加の注意：通常、固定フッターのアプローチでは、フッターの固定高さを設定する必要があります。私は身体の詰め物に75pxを使用しましたが、これで最高の結果を得ることができます。

2016-07-23 15:42:47 Toby

+0

多くのありがとうございます。完璧。私は時々基本を忘れる:) –

関連する問題