0

このようにするのは間違っていますか？

<div class="row">
  <div class="medium-6 columns">some content</div>
  <div class="medium-6 columns">some content</div>
  <div class="medium-6 columns">some content</div>
  <div class="medium-6 columns">some content</div>
  <div class="medium-6 columns">some content</div>
  <div class="medium-6 columns">some content</div>
</div>

それ以外の：

<div class="row">
  <div class="medium-6 columns">some content</div>
  <div class="medium-6 columns">some content</div>
</div>
<div class="row">
  <div class="medium-6 columns">some content</div>
  <div class="medium-6 columns">some content</div>
</div>
<div class="row">
  <div class="medium-6 columns">some content</div>
  <div class="medium-6 columns">some content</div>
</div>

結果は同じですが、sが少ないことがわかりますdiv。

4

2 に答える 2

0

どちらの方法も正しいです。.row を追加すると、物事が均一に保たれ、以前のフロートがクリアされるため便利です。div を 50% に切り替える小さなブレークポイントでこの例を取り上げます (12 列のグリッドを想定)。

<div class="row">
  <div class="small-6 medium-4 columns">some content</div>
  <div class="small-6 medium-4 columns">some content</div>
  <div class="small-6 medium-4 columns">some content</div>
</div>
<div class="row">
  <div class="small-6 medium-4 columns">some content</div>
  <div class="small-6 medium-4 columns">some content</div>
  <div class="small-6 medium-4 columns">some content</div>
</div>

上記の例では、グリッドが小さくなると、2、1、2、および 1 になります。今度は 1 行で実行します。

<div class="row">
  <div class="small-6 medium-4 columns">some content</div>
  <div class="small-6 medium-4 columns">some content</div>
  <div class="small-6 medium-4 columns">some content</div>
  <div class="small-6 medium-4 columns">some content</div>
  <div class="small-6 medium-4 columns">some content</div>
  <div class="small-6 medium-4 columns">some content</div>
</div>

この例は、2、2、および 2 に分類されます。2 番目の例でフローティングの問題が発生している場合、Foundation のイコライザーはこれらの問題を解決する優れた方法です。

于 2014-11-04T15:55:35.207 に答える