私はReactに基づいてフロントエンドプロジェクトを進めています。一つのプロジェクトでBootstrap 3とFlexboxの使用法を組み合わせる可能性があるのだろうかと思っていたのですが、Bootstrapコンポーネント(反応ブートストラップパッケージを使用)とFlexboxのレイアウト機能私が以前に試したように、ブートストラップと一緒に使用されるとき。一緒に働かせる方法はありますか?1つのプロジェクトでのブートストラップとFlexboxの使用
1
A
答えて
1
いくつかは、ブートストラップクラス名と競合row
、col-*
のような一般的なクラス名を、持っています。
あなたは、もちろんhttp://bulma.io/
これを試すことができ、それはグリッドよりもを提供していますが、あなただけのを試してみることができます。
ありがとうございます!
0
Apparantlyあなたの祈りは既に回答されている...フレックスCSSフレームワークの flexbox in Bootstrap
1
.flex-row {
display: flex;
flex-wrap: wrap;
}
.flex-row > [class*='col-'] {
display: flex;
flex-direction: column;
}
.flex-row.row:after,
.flex-row.row:before {
display: flex;
}
これが反応-ブートストラップで動作します:
<Row className="show-grid row-no-padding flex-row">
+0
ところで、React-Bootstrapを使用してください:これは最適な解決策です! https://react-bootstrap.github.io/components.html –
関連する問題
- 1. 1つのgithubプロジェクトを他のプロジェクトで使用する
- 2. 1つのプロジェクトでクッキーとトークンベースのパラレル化を使用する
- 3. 1つのプロジェクトでMongodbとMysqlの両方を使用する
- 4. 固定列幅が1つのFlexbox
- 5. NG-ブートストラップ:使用SCSSプロジェクトで
- 6. プロジェクト用の1つのデータソース
- 7. ブートストラップ4 navbarをflexboxを使う方法
- 8. 複数のブートストラップbuttongroupsを1つのページで使用する
- 9. AMSerialPort:1つのプロジェクトで2つのポートを使用する
- 10. Flexboxを搭載したブートストラップ4のCDN?
- 11. 1つのプロジェクトでのExpressセッションとトークン
- 12. Djangoプロジェクトで1つのビューを使用できますか?
- 13. 1行につきFlexBox要素
- 14. 2つの.NetコアMVCプロジェクトとWeb APIプロジェクトで1つのデータベースを使用する方法?
- 15. flexboxを使用した2つの要素のインライン化
- 16. 隠す1つのブートストラップ・テーブルヘッダ
- 17. Robotiumを使用した1つのプロジェクトの複数のテスト/テストケース
- 18. 1つのプロジェクトと別のプロジェクトのWeb APIとWebアプリケーション
- 19. 1つのプロジェクトでLaravel 2つのモジュール
- 20. デルファイ:別のプロジェクトで1つのプロジェクトのすべてのユニットとユニット参照を使用する方法
- 21. 1つのJavaプロジェクトのキューとトピック
- 22. 1つのポートとフロントエンドのWeb APIプロジェクト
- 23. 1つのプロジェクトで2つ以上のキュードライバを使用する方法laravel v4.2
- 24. 1つのプロジェクトでsugar ormとgoogle analyticsを使用する方法
- 25. mavenと1つのプロジェクトで異なるdenpendencyを使用する方法(アンドロイド)
- 26. 1ページあたりのスクリプト#を使用した1つのプロジェクトのJavascriptファイル
- 27. 1つのソリューションと複数のプロジェクトの複数のプロジェクト
- 28. 私は私のプロジェクトでは、ブートストラップ崩壊を使用していたブートストラップ崩壊
- 29. 図のfigcaptionにflexboxを使用する
- 30. Xcodeプロジェクトとxamarinプロジェクトを1つのプロジェクトに統合
そうでないブートストラップ3と、まだ、私は彼らがブートストラップ4でそれに取り組んでいる知っているが、私は推測します。右? – dagitab