What is the html structure?


The template is based on the Foundation Framework

The Foundation grid system consist of 12 columns. Width of each column is specified in/by the small-#, medium-#, and large-# classes.

 

<div class="row">
    <div class="small-2 large-4 columns">...</div>
    <div class="small-4 large-4 columns">...</div>
    <div class="small-6 large-4 columns">...</div>
</div>
<div class="row">
    <div class="large-3 columns">...</div>
    <div class="large-6 columns">...</div>
    <div class="large-3 columns">...</div>
</div>
<div class="row">
    <div class="small-6 large-2 columns">...</div>
    <div class="small-6 large-8 columns">...</div>
    <div class="small-12 large-2 columns">...</div>
</div>
<div class="row">
    <div class="small-2 large-4 columns">...</div>
    <div class="small-4 large-4 columns">...</div>
    <div class="small-6 large-4 columns">...</div>
</div>
<div class="row">
    <div class="large-3 columns">...</div>
    <div class="large-6 columns">...</div>
    <div class="large-3 columns">...</div>
</div>
<div class="row">
    <div class="small-6 large-2 columns">...</div>
    <div class="small-6 large-8 columns">...</div>
    <div class="small-12 large-2 columns">...</div>
</div>
<div class="row">
    <div class="small-2 large-4 columns">...</div>
    <div class="small-4 large-4 columns">...</div>
    <div class="small-6 large-4 columns">...</div>
</div>
<div class="row">
    <div class="large-3 columns">...</div>
    <div class="large-6 columns">...</div>
    <div class="large-3 columns">...</div>
</div>
<div class="row">
    <div class="small-6 large-2 columns">...</div>
    <div class="small-6 large-8 columns">...</div>
    <div class="small-12 large-2 columns">...</div>
</div>

 If you need more information about the Foundation grid system, please visit the official foundation documentation.

Tags: htm, markup, structure

Last update:
2014-11-20 08:31
Author:
Daniel Verejan
Revision:
1.0
Average rating:0 (0 Votes)