基礎6を使用すると、large-9 column
の左側にlarge-3 column
があります。これは素晴らしいことですが、特定の状況ではlarge-3 column
が存在しない場合があります。この場合、残りの列が行の全体を埋めるようにします。つまり、代わりにlarge-12
列のように動作します。私は、このようなことは、どういうわけか、Foundationによってネイティブにサポートされるべきだと思っていますが、ドキュメントでは何も見ることはできませんでした。幅9の列を他の列がない場合は全幅で埋めてください
0
A
答えて
0
TL:DR; - 財団は、この機能をサポートしていませんが、私はあなたの質問を読んで、いくつかの可能な解決策があります。
が
large-3 columns
の存在をどのように制御しますか?それが何らかの種類のスクリプト/クエリ(PHP/Python)を介している場合、関連するdivをエコーすることができます。あなたが特定の解像度でそれを非表示にする必要がある場合は、機能が内蔵され、グリッドの使用することができますif (some_condition === true) { echo '<div class="large-3 columns">...</div>'; echo '<div class="large-9 columns">...</div>'; } else { echo '<div class="large-12 columns">...</div>'; }
:例えば
<div class="row"> <div class="large-3 show-for-large columns"><!-- ... --></div> <div class="large-9 medium-12 columns"><!-- ... --></div> </div>
をあなたはjQueryの
remove()
メソッドを介してのdivを追加/削除することができます。$(".large-3").remove();
私はそれが助けたことを願っています。とにかく、私たちがもっと助けることができるように、コードを自由に追加してください。
関連する問題
- 1. 固定幅divを等幅フォントで埋めてください
- 2. コレクションビューセル内のボタンの幅を埋めてください
- 3. 幅の書式の余白を埋めてください
- 4. グリッドの行幅が他の列の高さ(XAMLの場合)
- 5. 他の列がNULLの場合は列を選択してください
- 6. CSS、すべてのdivの幅をテキストで埋めてください
- 7. オーバーフロー:autoの場合は、幅の値(幅の最大値)を変更しないでください。 (スクロールバーCSS)
- 8. できるだけ幅を動的に埋めてください
- 9. ブラウザウィンドウの幅を埋めるためにイメージを伸ばしてください
- 10. pandas:numpyの配列で列を埋めてください
- 11. AlertDialogで親の幅を埋める方法を教えてください
- 12. JQuery Datatableの列配列(幅と幅が同じではない)
- 13. css親の全幅を占めていない100%幅div
- 14. 行の列幅を "display:table"に設定してください
- 15. htmlテーブルの最初の列の幅がピクセルの幅に合っていない
- 16. QTableWidget pyqtに合わせて列幅を調整してください
- 17. divを全幅に伸ばしてください(利用可能なスペースがある場合)
- 18. M行列を1Dリストのpythonで埋めてください
- 19. イオングリッド - 行が全幅を占めない
- 20. UITableViewCellがテーブルの幅を埋めていない
- 21. 列の幅の合計!=表幅の場合の動作は何ですか?
- 22. Foundation 6の全幅と全幅でないデフォルトのグリッド幅は何ですか?
- 23. 列の数が異なる場合、行の全幅を作る方法
- 24. Ionic2フッタツールバーのテキストがIOSの全幅を占めていない
- 25. オペレーションの場合は、配列全体をチェックしてください
- 26. フレックスラップカラム:使用可能な幅を列で記入してください
- 27. JQueryのモバイルボタン内の2つの列グリッドは、幅を埋めていません
- 28. グリッドCSS全幅列
- 29. テーブルの列を多次元配列のデータで埋めてください。javascript
- 30. HTMLテーブルがウィンドウの全幅を占めていない