Milligram: グリッドの問題

作成日 2016年02月25日  ·  5コメント  ·  ソース: milligram/milligram

こんにちは、私はグリッドで作業しました、そして私は100以上のプロフィールカードを持っているメンバーページを持っています。 列25で1つの行を作成しましたが、すべてが1行になります。

そのための解決策はありますか? 私はそれらを4列のように必要とし、次にその下にあります、今それらはすべて1行にあります、私のコードはこのようになります

<div class="row">
  <div class="column column-25"></div>
  <div class="column column-25"></div>
   <div class="column column-25"></div>
  <div class="column column-25"></div>
   <div class="column column-25"></div>
  <div class="column column-25"></div>
   <div class="column column-25"></div>
  <div class="column column-25"></div>
</div>
bug question

最も参考になるコメント

行ラップクラスを追加する必要があります。

<div class="row row-wrap">

ただし、これを使用すると、ブラウザのサポートがさらに制限されることに注意してください。

全てのコメント5件

行ラップクラスを追加する必要があります。

<div class="row row-wrap">

ただし、これを使用すると、ブラウザのサポートがさらに制限されることに注意してください。

同じ問題があり、行ラップの追加は機能しないようです:

http://codepen.io/steveoc64/pen/WwQgxG

ただし、スタイルを手動でオーバーライドすると、スタイルは動作します。

<div class="row" style="flex-wrap: wrap">

CSSが期待どおりに動作しない理由を理解するのに十分な知識がありません。

私の側に見落としがありました、それはそうあるべきでした:

<div class="row">
    <div class="row-wrap">
        ....
    </div>
</div>

とはいえ、これは、表示プロパティの継承がフレックスではなくブロックであるように見えるため、機能していないようです。 おそらく、意図された設計は前述のものでした。 言い換えれば、あなたの解決策はおそらく意図された解決策でした。

Imadに感謝します...「回避策」は今のところうまくいきますが、最初の意図も機能するようにすることも試みます。

class = "row row-wrap"を期待どおりに実行し、その下に別のdivをネストする必要がないのは妥当なようです。

...雨の日の別の仕事;)

こんにちは@ kresogalic8あなたは問題を解決することができますか? #100

今のところ、この問題を閉じます。 他にご不明な点がございましたら、お気軽にお問い合わせください。

このページは役に立ちましたか?
0 / 5 - 0 評価