問題タブ [sticky-footer]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
css - ページの下部にフッターを固定する
私が作成しているサイトのいくつかのコードで問題が発生しています。かなり単純なはずですが、そう証明されていません。
フッターをページの下部に固定したいが、すべてのコンテンツが最初に来るようにしたい (それが理にかなっていれば、1 ページ以上の価値がある場合)
私は Safari、Chrom、Firefox でそれを行うことができましたが、サプライズ サプライズ Internet Explorer が主な問題であることが証明されています。
現在は下部にありますが、ページのコンテンツが多い場合はフッターがページのコンテンツの上に表示されます (「私たちについて」タブを参照してください)。
http://www.break-comms.com/index.html
これは本当に私を悩ませ始めているので、これについて何か助けていただければ幸いです。コードを変更する砦に数時間戻ってきました。
以下は、このページに付随する CSS です。
css - ネストされた div 100% の高さ、スティッキー フッター
#main
ページをスティッキーフッターまで埋めたいコンテナdiv内にネストされたdivがあります。角度をいろいろ試してみましたが、うまくいきません。firebug を使用しない場合は、お問い合わせください。CSS などを提供します。
ありがとう。
css - CSS が動的にフッターを配置する (スティッキー フッターの問題)
スティッキーフッターと同じ効果を達成しようとしていますが、ここで尋ねられるチュートリアルや質問には表示されない問題があります。フッターの高さも動的です。
フッターにいくつかのニュース項目があるので、それらのニュース項目の長さに応じてフッターの高さが変わります。明らかに、コンテンツの高さがブラウザーのビューポートよりも小さい場合はフッターをページの下部に絶対配置し、高さが実際のビューポートよりも高い場合はコンテンツに対して相対的に配置する必要があります。
現在、私はこれを jQuery でうまく実装していますが、ブラウザーで JavaScript を無効にしているユーザーもいるため、CSS のみのメソッド (もしあれば) が欲しいです。
どうもありがとうございました!
編集:
私のコードはほとんど普通です:タグに<header>
、<aside>
、 、<section>
および があります。jQuery では、これらの要素 (フッターを除く) の高さの合計をブラウザーのビューポートとほぼ比較します。値が大きい場合はフッターに a を追加し、そうでない場合は a をフッターに追加します。<footer>
<body>
position:relative
position:absolute; bottom:0
html - 内側のコンテナが繰り返されない-スティックフッターの場合はy
私はこのガイドに従った粘着性のあるフッターが欲しかった:http ://www.cssstickyfooter.com/using-sticky-footer-code.html
背景画像にインアウトラップ(コンテナ)とインナーラップ(コンテナ2)を使用しています。
フッターを下に貼り付けることができましたが、container2の背景画像が垂直方向に完全に繰り返されていません。
助けが必要です。
css - いくつかの解決策を試した後、フッターがくっつかない
フッターがページの下部にくっつくのに問題があります。これは私が設計している 1024x1280 で動作しますが、#content セクションがフッターと重なり、1024x768 と 800x600 でテストするとすぐにウィンドウの下部に空白が生じます。私はもう試した:
- フッター位置を絶対位置 w/ bottom:0 に設定します。
- position:fixed を使用すると機能しますが、コンテンツと重なってしまいます。コンテンツの後に表示したい。
- コンテナーにパディングを追加し、フッターを負のマージンで引き上げる
- #content にパディングを追加し、負のマージンでフッターを引き上げる
- フッターと同じ高さに設定された恐ろしいハッキー #push div の使用
この時点で、いくつかの Jquery を使用して実行する準備が整いましたが、問題を解決する CSS の方法があれば、提案を受け付けています。
編集: 少し不安定に見える場合は、背景画像を引き伸ばすプラグインを追加しているためです。混乱を許してください!
html - Djangoテンプレートのフッターのセンタリングに問題があります
フッターをDjangoテンプレートの中央に配置しようとすると問題が発生します。フッターdivクラスはPaginationです。
ベースHTML:
実際のページのHTML:
css - ウェブページの下部に画像を貼り付ける
やあみんな、私はページの下部に広告があるWebページを持っています。今、ユーザーがページを下にスクロールするときはいつでも、広告は下部にのみ表示され、スティッキー広告のように表示されるようにしたいと思います。 ...どうすればこれを達成できますか?
前もって感謝します。
css - フッターの重複コンテンツ
助けてくれてありがとう。
あなたはこれをオンラインで見ることができます
問題は私のフッターです。コンテンツの下に留まらないようです。マシュー・ジェームス・テイラーの方法を使おうとしましたが、うまくいきませんでした。コンテンツがページを埋めるときはフッターをコンテンツの下に置き、コンテンツがページを埋めないときはウィンドウの下部にとどまる必要があります(スティッキーフッター)。JS以外のソリューションを探しています。
再度、感謝します。
html - CSS: 幅 100% の要素が存在するときに右にスクロール: 右側の部分に背景が存在しませんか?
これに苦しむ多くのサイトを見てきましたが、100% 伸びる背景に没頭したのはつい最近のことです...
例は
http://brassblogs.com/blog/sticky-footer
ブラウザーの幅を制限して右にスクロールすると、見た目が悪くなります。背景が引き継がれません。どうすればこれを修正できますか?
編集:へー、自分で答えを見つけたらすぐに答えが出ました.... ハハ。
html - CSS でフッターを任意のページの下部に貼り付けるにはどうすればよいですか?
これは私のコードです:
これの何が問題なのかわかりません - 誰か助けてくれますか?
編集:何が問題なのかをより明確にするために:ページが読み込まれると、フッターが期待どおりに下部に表示されます。ただし、スクロール バーが表示されるように Web ページの高さが画面上の寸法よりも大きい場合、フッターは同じ位置にとどまります。つまり、ページの高さが 100% 以下の場合、フッターは一番下に表示されます。ただし、ページの高さが 100% を超える場合、フッターはそのページの下部ではなく、表示されている画面の下部に表示されます。
編集: 驚くべきことに、以下の解決策はどれも機能しませんでした。代わりにサイドバーを実装することになりました。