Foundation <nav data-topbar> disallows writing a <section> into <div>

问题

Is this behaviour expected, or a bug?

When using Zurb Foundation 5's top-bar component, the rendered HTML is doesn't allow me to put a «section» tag inside of a «div». I have troubleshooted enough to know that this only occurs when you add the data-topbar attribute to the «nav». I am able to add a «ul» element in the «div» and have it render properly. However, the «section class="tob-bar-section"» is fighting me.

Markup written to file:

<nav data-topbar="topbar">
    <div>
      <section></section>
    </div>
</nav>

Markup rendered by browsers (FF/Chrome):

<nav data-topbar="topbar">
    <div></div>
    <section></section>
</nav>

Thank you for any help!

回答1:

It may not be the classiest solution, but seeing as no matter what route I took short of rewriting my app, this problem was persistent.

Instead of fighting it, I just moved the section on it's own.

topBarReposition: function () {
    var topbar = $(".header_wrap .top-bar-section"),
        sibling = $(".header_wrap .row ul");

    $(sibling).after(topbar);
}

来源：https://stackoverflow.com/questions/32235446/foundation-nav-data-topbar-disallows-writing-a-section-into-div