zurb-foundation sections - ＆gt;在导航部分时引入了奇怪的空白

Question

我觉得自己像个白痴。我正在尝试zurb基础部分。我使用的是最新版本4.3.1。

我正在关注他们在这里的文档：http://foundation.zurb.com/docs/components/section.html并且在导航结果时我的行为变得很奇怪。看下面的截图。 我做错了什么？

这是我的代码

<form data-abide action="">
<div class="row">
    <div class="small-24 columns">
        <div class="section-container auto" data-section>
            <section class="section">
                <p class="title" data-section-title><a href="#panel1">Panel 1</a></p>
                <div class="content" data-section-content><p>Content of section 1.</p></div>
            </section>
            <section class="section">
                <p class="title" data-section-title><a href="#panel2">Panel 2</a></p>
                <div class="content" data-section-content><p>Content of section 2.</p></div>
            </section>
            <section class="section">
                <p class="title" data-section-title><a href="#panel3">Panel 3</a></p>
                <div class="content" data-section-content><p>Content of section 3.</p></div>
            </section>
            <section class="section">
                <p class="title" data-section-title><a href="#panel4">Panel 4</a></p>
                <div class="content" data-section-content><p>Content of section 4.</p></div>
            </section>
        </div>
    </div>
</div>
</form> 

Answer 1

使用

dysplay:none

表示非活动内容和

dysplay:block

表示活动

Answer 2

哎呀。我的错。我以为我已经升级了基础，但事实证明我的rubygems环境路径有点麻烦。

真的升级到4.3.1之后，问题就不存在了。