【CSS】footerにボタンなどを固定したいときの設定

WEB系フリーランスの備忘録
平均読了時間→ < 1

スマホなどでよくあるデザインですが、Bootstrapに頼るほどでもなかったりする「固定フッター」。

考えてみれば単純ですが、難しく考えがちなあなたのためにここに書き残しておきます。(断じて忘れっぽい自分のためではない)

とりあえず、HTML側でclass名を”sticky-footer”としてもらい、CSS側で以下の記述をお願いします。

実際の位置や背景色はご自由にどうぞ。

.sticky-footer {
  position: fixed;
  bottom: 5rem;
  left: 0;
  width: 100%;
  height: 35px;
  padding:0px;
  background-color:rgba(0,0,0,0);
}

ABOUT US

めがねん
【WEB制作を副業にできた人】 #30DAYSトライアル で独学 → CW営業 → 制作会社のパートナー → 制作チーム結成 → エンド営業|MENTAでメンターやってます。独学や営業の方法をお伝えしてます▶︎http://menta.work/plan/3110 |Twitterでは独学者向けに有益ツイートを拡散|犬が好きです。大好きです。