zurb-foundation - Zurb Foundation（使用 jsFiddle）为什么空 div/单元格的行高与行的其余部分不匹配？

Question

在此处的示例中：http: //jsfiddle.net/carled/bu2Dw/ 我希望（并且希望！）看到两个空的侧面单元格（“small-2 columns menuHeader”）与整个高度匹配排。请问为什么不会发生这种情况？

    <div class="row">
        <div class="small-2 columns menuHeader">&nbsp;</div>
        <div class="small-8 columns menuHeader">
            <div class="row">
                <div class="small-4 columns text-left">
                    <img src="http://placehold.it/150x80&text=Image 1" />
                    </div>
                <div class="small-4 columns text-left">
                    <img src="http://placehold.it/150x80&text=Image 2" />
                    </div>
                <div class="small-4 columns text-left">
                    <img src="http://placehold.it/150x80&text=Image 3" />
                    </div>
            </div>
        </div>
        <div class="small-2 columns menuHeader">&nbsp;</div>
    </div>

Answer 1

大量的实验导致只是将它封装在一个 12 列的 div 中，效果很好：

    <div class="row">
        <div class="small-12 columns menuHeader">
            <div class="row">
                <div class="small-2 columns">&nbsp;</div>
                <div class="small-8 columns">
                    <div class="row">
                        <div class="small-4 columns text-left">
                            <img src="http://placehold.it/150x80&text=Image 1" />
                            </div>
                        <div class="small-4 columns text-left">
                            <img src="http://placehold.it/150x80&text=Image 2" />
                            </div>
                        <div class="small-4 columns text-left">
                            <img src="http://placehold.it/150x80&text=Image 3" />
                            </div>
                    </div>
                </div>
                <div class="small-2 columns">&nbsp;</div>
            </div>
        </div>
    </div>