ホームページ > 記事 > ウェブフロントエンド > Bootstrap 3 から Bootstrap 4 に移行する際の垂直列の配置の問題を修正するにはどうすればよいですか?
ブートストラップ 3 からブートストラップ 4: 垂直方向の列の配置が解決されました
ブートストラップ 3 から 4 に移行する際に、垂直方向の配置の問題が発生する可能性があります。あなたのコラム。これは、Bootstrap 4 でネストされた列の処理方法に構造的な変更が導入されたために発生します。
この問題を修正し、水平方向の列の配置を復元するには、ネストされた列を囲む Col-12 クラスを削除することが不可欠です。ドキュメントで説明されているように、ブートストラップ 4 ではネストするための新しい行が必要です。
「ブートストラップ 3 で .col-xs-* を使用した場合は、ブートストラップ 4 では必ず .row を、行が問題を引き起こす可能性があります。"
改訂コード:
<div class="row"> <div class="col-md-2"> <h1>TEST</h1> </div> <div class="col-md-2"> <h1>TEST</h1> </div> <div class="col-md-2"> <h1>TEST</h1> </div> <div class="col-md-2"> <h1>TEST</h1> </div> </div>
さらに、これは JavaScript Fiddle を使用して検証できます:
https:// jsfiddle.net/aq9Laaew/4791/
以上がBootstrap 3 から Bootstrap 4 に移行する際の垂直列の配置の問題を修正するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。