[解決済み】ウェブページの下にフッターを表示させるには?
2022-03-26 20:54:51
質問
私は、フッター付きのシンプルな2カラムレイアウトを持っており、マークアップの右と左の両方のdivをクリアしています。 問題は、すべてのブラウザでフッターをページの一番下に表示することができないことです。 コンテンツがフッターを押し下げる場合はうまくいきますが、そうでない場合もあります。
解決方法は?
フッターをスティッキーにするには。
-
を持たせる。
<div>
とclass="wrapper"
をコンテンツに使用します。 -
右 前 閉じた
</div>
のwrapper
を配置します。<div class="push"></div>
. -
右 後 最後の
</div>
のwrapper
を配置します。<div class="footer"></div>
.
* {
margin: 0;
}
html, body {
height: 100%;
}
.wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -142px; /* the bottom margin is the negative value of the footer's height */
}
.footer, .push {
height: 142px; /* .push must be the same height as .footer */
}
関連
-
[解決済み】DIVの幅が100%というのは本当の100%ではない
-
[解決済み】divの高さを画面の残りスペースで埋めるようにする
-
[解決済み] textareaのresizableプロパティを無効にするにはどうしたらよいですか?
-
[解決済み] Webフォームのフィールド/入力タグでブラウザのオートコンプリートを無効にするにはどうすればよいですか?
-
[解決済み] ページを再読み込みせずにURLを変更するにはどうすればよいですか?
-
[解決済み] 画面サイズ、現在のウェブページ、ブラウザウィンドウのサイズを取得する
-
[解決済み] 親ディバイスの高さを指定せずに、子ディバイスの高さを100%にする方法は?
-
[解決済み] 残りの幅を埋めるためにdivを展開する
-
[解決済み] HTMLページのフッターを最小限の高さでページの下にとどめ、かつページには重ならないようにするCSS
-
[解決済み】スクロールバーがあってもdivが常にページの一番下に表示されるようにする
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】ボックスにサイズ/部分的なボーダーを宣言する方法はありますか?
-
[解決済み] "セレクタ(CSS)にIDを使うな "なら、IDの代わりに何を使えばいい?
-
[解決済み] Chrome で注入されたスタイルシートによる奇妙なスタイリングが発生する
-
[解決済み] DIVの背景色が表示されない
-
[解決済み] divを親の中で自動的に縦に重ねるにはどうしたらいいですか?
-
[解決済み] Ionicカードリスト作成
-
[解決済み] bootstrap 4 でカードブロックの不透明度を変更する方法
-
[解決済み] JavaFX Labelの文字色を変更する方法
-
[解決済み] Bootstrap 4のclass="mb-0 "とは何ですか?
-
[解決済み] CSS 不透明度 - 背景色