3

Zurb Foundation 5 でこの奇妙な問題が発生しました。行を行内にネストするたびに、負のマージンが生成され、グリッドから放り出されます。私のコードのマークアップの例は次のとおりです。

<div class="row main-content">
    <div class="row">
        <div class="breadcrumbs columns small-12">My account / Companies list /</div>
        <div class="columns small-6 heading-container">
            <h1>Create new company</h1>
        </div>
    </div>
</div>

そして、これがその財団が生成するコードです。

.row .row {
    width: auto;
    margin-left: -0.9375rem;
    margin-right: -0.9375rem;
    margin-top: 0;
    margin-bottom: 0;
    max-width: none;
}

この動作を防ぐにはどうすればよいですか? マークアップに何か問題がありますか、それとも基盤の scss をオーバーライドする必要がありますか (ただし、デフォルトのスタイルをオーバーライドしたくありません)。

4

2 に答える 2

3

行内にネストする必要があります。つまり

<div class="row">
  <div class="breadcrumbs small-12 columns">
     My account / Companies list /
    <div class="row">
    <div class="Heading-container small-6 columns">
      <h1>Create new company</h1>
    </div>
   </div> <!--/nested row-->
 </div>
</div><!--/row-->
于 2014-05-08T20:36:24.150 に答える