Menu icon Foundation
Page container as single .row

Is it ok to have a .row container that contains more than 12 (or the default amount) of columns ?
Like this:

<div class="site-container row">
    <header class="site-header large-12 columns">
      
    </header>
    <nav class="site-nav large-12 columns">
      
    </nav>
    <main class="site-main large-8 columns">
      
    </main>
    <aside class="site-aside large-4 columns">
      
    </aside>
    <footer class="site-footer large-12 columns">
      
    </footer>
</div>

By ok I mean from the browser compatibility point of view.

gridrowlayout

Is it ok to have a .row container that contains more than 12 (or the default amount) of columns ?
Like this:

<div class="site-container row">
    <header class="site-header large-12 columns">
      
    </header>
    <nav class="site-nav large-12 columns">
      
    </nav>
    <main class="site-main large-8 columns">
      
    </main>
    <aside class="site-aside large-4 columns">
      
    </aside>
    <footer class="site-footer large-12 columns">
      
    </footer>
</div>

By ok I mean from the browser compatibility point of view.


Wing-Hou Chan gave the most helpful answer for this post
Wing-Hou Chan over 5 years ago

Hi Eugene,

That is perfectly fine. Your page would render like this:

large-12
large-12
large-8 large-4
large-12

This post has been closed. No new replies can be added.

Wing-Hou Chan over 5 years ago

Hi Eugene,

That is perfectly fine. Your page would render like this:

large-12
large-12
large-8 large-4
large-12

Eugene Kudryavtsev over 5 years ago

Thanks for your reply!