横幅指定の無いflexboxコンテナーの中に
bootstrapのtable-responsiveで横幅の大きなテーブルを入れようとおもったらうまくはみ出してくれない
<div class="flexwrap"> <div class="flex1"></div> <div class="flex4"></div> <div class="flex1"></div> </div>
こんな感じで
横幅が1:4:1の3カラムレイアウトになってます
この真ん中のメインコンテンツにテーブルがあります
<div class="flexwrap"> <div class="flex1"></div> <div class="flex4"> <div class="table-responsive"> <table></table> </div> </div> <div class="flex1"></div> </div>
ここのテーブルは横幅が大きなものにしたく
はみ出した部分はoverflow-x:scrollとしたい
しかし現状はtable幅が大きいと
flex4の幅も大きくなり絡む落ちしちゃいます。
これってflex-itemとなる要素の幅を明示しないと駄目ですかね。。。
それしか方法はないのでしょうか?
CSSも追記ください。
回答1件
あなたの回答
tips
プレビュー