[解決済み] Bootstrap 4のColでコンテンツを下に揃える方法
2022-01-28 03:43:58
質問
フッターに次のようなコードを書いています。
<div class="container"> <hr>
<div class="row">
<div class="col-md-6">
© BusinessName 2017.
</div>
<div class="col-md-3"> <br>
<a href="/blog"> Blog </a> <br>
<a href="/blog"> FAQ </a> <br>
<a href="/blog"> About </a>
</div>
<div class="col-md-3">
<p><strong>Contact</strong> <br> [email protected] <br> more info bla bla <br> more more more info</p>
</div>
</div> </div>
私はすべてのコンテンツを最下行に整列させようとしています。いくつかのことを試しましたが、何もうまくいきません。
解決方法は?
を使用することができます。
align-items-end
から
Bootstrap 4 の新しいフレックスボックス・ユーティリティ
...
<div class="container">
<hr>
<div class="row align-items-end">
<div class="col-md-6">
© BusinessName 2017.
</div>
<div class="col-md-3">
<a href="/blog"> Blog </a>
<br>
<a href="/blog"> FAQ </a>
<br>
<a href="/blog"> About </a>
</div>
<div class="col-md-3">
<strong>Contact</strong>
<br> [email protected]
<br> more info bla bla
<br> more more more info
</div>
</div>
</div>
http://codeply.com/go/GXTF43toS9
また、オートマージンはフレックスボックス内でも機能します。そこでは
mt-auto
(margin-top:auto)を使って、col-*を一番下に押し出すことができます。
関連
-
[解決済み] Bootstrap 4のVertical Align Center [重複]について
-
[解決済み] Twitter Bootstrapのメニューをクリックではなく、ホバーでドロップダウンさせる方法
-
[解決済み] Twitter Bootstrap 3を使用して列を中央に配置する
-
[解決済み] Bootstrapの列をすべて同じ高さにするにはどうしたらいいですか?
-
[解決済み] Bootstrap3による垂直方向の整列
-
[解決済み] フレックスアイテムを右寄せにするには?
-
[解決済み] Bootstrapのcol-lg-*、col-md-*、col-sm-*の違いは何ですか?
-
[解決済み] Bootstrapでナビバーアイテムを右寄せにする
-
[解決済み】display:flexを使って残りの縦幅をCSSで埋める。
-
[解決済み】フレックスボックスで要素を最下段に揃える
最新
-
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 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] Bootstrap 4のColでコンテンツを下に揃える方法
-
[解決済み] twitterのbootstrapで五等分の列を作る
-
[解決済み】Font-awesome、入力タイプ'submit'
-
[解決済み】リストセレクトボックス(ドロップダウン)をbootstrapでレンダリングする方法は?
-
[解決済み】これらの属性は何ですか。アリア・ラベリングビー`とアリア・ヒドゥン`です。
-
[解決済み] reactjsアプリでbootstrapのcssとjsをインクルードする方法は?
-
[解決済み] Bootstrap 4: ドロップダウンメニューが画面の右側にずれていく
-
[解決済み] Bootstrap: コンテナの幅を変更するには?
-
[解決済み] bowerでbootstrapを使用する
-
[解決済み] Bootstrapでテーブルの上にカーソルを置くと、カーソルの色を変更するにはどうすればよいですか?