Tables

Basic Tables

One Two Three Four Five
Lorem Ipsum dolor sit amet consectetur adipiscing elit
Lorem Ipsum dolor sit amet consectetur adipiscing elit
Lorem Ipsum dolor sit amet consectetur adipiscing elit
Lorem Ipsum dolor sit amet consectetur adipiscing elit
Lorem Ipsum dolor sit amet consectetur adipiscing elit


[table type="basic"]
<thead>
  <tr>
   <th>One</th>
   <th>Two</th>
   <th>Three</th>
   <th>Four</th>
   <th>Five</th>
   </tr>
</thead>
<tbody>
  <tr  class="odd">
   <td> Lorem Ipsum</td>
   <td> dolor sit</td>
   <td> amet</td>
   <td> consectetur adipiscing</td>
   <td> elit</td>
  </tr>
  <tr>
   <td> Lorem Ipsum</td>
   <td> dolor sit</td>
   <td> amet</td>
   <td> consectetur adipiscing</td>
   <td> elit</td>
  </tr>
  <tr  class="odd">
   <td> Lorem Ipsum</td>
   <td> dolor sit</td>
   <td> amet</td>
   <td> consectetur adipiscing</td>
   <td> elit</td>
  </tr>
  <tr>
   <td> Lorem Ipsum</td>
   <td> dolor sit</td>
   <td> amet</td>
   <td> consectetur adipiscing</td>
   <td> elit</td>
  </tr>
  <tr  class="odd">
   <td> Lorem Ipsum</td>
   <td> dolor sit</td>
   <td> amet</td>
   <td> consectetur adipiscing</td>
   <td> elit</td>
  </tr>
</tbody>
[/table]

Zebra Horizontal Tables

One Two Three Four Five
Lorem Ipsum dolor sit amet consectetur adipiscing elit
Lorem Ipsum dolor sit amet consectetur adipiscing elit
Lorem Ipsum dolor sit amet consectetur adipiscing elit
Lorem Ipsum dolor sit amet consectetur adipiscing elit
Lorem Ipsum dolor sit amet consectetur adipiscing elit


[table type="zebra_horizontal"]
<thead>
  <tr>
   <th>One</th>
   <th>Two</th>
   <th>Three</th>
   <th>Four</th>
   <th>Five</th>
   </tr>
</thead>
<tbody>
  <tr  class="odd">
   <td> Lorem Ipsum</td>
   <td> dolor sit</td>
   <td> amet</td>
   <td> consectetur adipiscing</td>
   <td> elit</td>
  </tr>
  <tr>
   <td> Lorem Ipsum</td>
   <td> dolor sit</td>
   <td> amet</td>
   <td> consectetur adipiscing</td>
   <td> elit</td>
  </tr>
  <tr  class="odd">
   <td> Lorem Ipsum</td>
   <td> dolor sit</td>
   <td> amet</td>
   <td> consectetur adipiscing</td>
   <td> elit</td>
  </tr>
  <tr>
   <td> Lorem Ipsum</td>
   <td> dolor sit</td>
   <td> amet</td>
   <td> consectetur adipiscing</td>
   <td> elit</td>
  </tr>
  <tr  class="odd">
   <td> Lorem Ipsum</td>
   <td> dolor sit</td>
   <td> amet</td>
   <td> consectetur adipiscing</td>
   <td> elit</td>
  </tr>
</tbody>
[/table]

Zebra Vertical Tables

One Two Three Four Five
Lorem Ipsum dolor sit amet consectetur adipiscing elit
Lorem Ipsum dolor sit amet consectetur adipiscing elit
Lorem Ipsum dolor sit amet consectetur adipiscing elit
Lorem Ipsum dolor sit amet consectetur adipiscing elit
Lorem Ipsum dolor sit amet consectetur adipiscing elit


[table type="zebra_vertical"]
 <colgroup>
 <col class="col_odd">
 <col class="even">
 <col class="col_odd">
 <col class="even">
 <col class="col_odd">
 </colgroup>
   <thead>
    <tr>
     <th>One</th>
     <th>Two</th>
     <th>Three</th>
     <th>Four</th>
     <th>Five</th>
     </tr>
   </thead>
   <tbody>
    <tr>
     <td> Lorem Ipsum</td>
     <td> dolor sit</td>
     <td> amet</td>
     <td> consectetur adipiscing</td>
     <td> elit</td>
    </tr>
    <tr>
     <td> Lorem Ipsum</td>
     <td> dolor sit</td>
     <td> amet</td>
     <td> consectetur adipiscing</td>
     <td> elit</td>
    </tr>
    <tr>
     <td> Lorem Ipsum</td>
     <td> dolor sit</td>
     <td> amet</td>
     <td> consectetur adipiscing</td>
     <td> elit</td>
    </tr>
    <tr>
     <td> Lorem Ipsum</td>
     <td> dolor sit</td>
     <td> amet</td>
     <td> consectetur adipiscing</td>
     <td> elit</td>
    </tr>
    <tr>
     <td> Lorem Ipsum</td>
     <td> dolor sit</td>
     <td> amet</td>
     <td> consectetur adipiscing</td>
     <td> elit</td>
    </tr>
   </tbody>
[/table]

Pricing Table

Basic pricing table with active tab

Free$0

  • 10GB Disk Space
  • 100GB Monthly Bandwidth
  • 20 Email Accounts
  • Unlimited subdomains

Advanced$50

  • 10GB Disk Space
  • 100GB Monthly Bandwidth
  • 20 Email Accounts
  • Unlimited subdomains

Enterprise$125

  • 10GB Disk Space
  • 100GB Monthly Bandwidth
  • 20 Email Accounts
  • Unlimited subdomains


<div class="row">
  <div class="twelve columns centered mobile-four mobile-twelve">
            <h3>Pricing Table</h3>
            <p>Basic pricing table with active tab</p>
            
      <div id="pricing_table" class="clear pricing_3_col table_w_active">
            <div class="pricing_section">
                <h3>Free<span>$0</span></h3>
              <ul>
                    <li><strong>10GB</strong> Disk Space</li>
                    <li><strong>100GB</strong> Monthly Bandwidth</li>
                    <li><strong>20</strong> Email Accounts</li>
                    <li><strong>Unlimited</strong> subdomains</li>
                </ul>
          <p><a class="signup">Sign up</a></p>
        </div>
        
            <div class="pricing_section pricing_active">
                <h3>Advanced<span>$50</span></h3>
              <ul>
                    <li><strong>10GB</strong> Disk Space</li>
                    <li><strong>100GB</strong> Monthly Bandwidth</li>
                    <li><strong>20</strong> Email Accounts</li>
                    <li><strong>Unlimited</strong> subdomains</li>
                </ul>
              <p><a class="signup">Sign up</a></p>
            </div>
            
            <div class="pricing_section">
                <h3>Enterprise<span>$125</span></h3>
                <ul>
                    <li><strong>10GB</strong> Disk Space</li>
                    <li><strong>100GB</strong> Monthly Bandwidth</li>
                    <li><strong>20</strong> Email Accounts</li>
                    <li><strong>Unlimited</strong> subdomains</li>
                </ul>
                <p><a class="signup">Sign up</a></p>
        </div>
      </div> 
      
  </div>
</div>

Pricing Table

Basic pricing table

Free$0

  • 10GB Disk Space
  • 100GB Monthly Bandwidth
  • 20 Email Accounts
  • Unlimited subdomains

Basic$25

  • 10GB Disk Space
  • 100GB Monthly Bandwidth
  • 20 Email Accounts
  • Unlimited subdomains

Advanced$50

  • 10GB Disk Space
  • 100GB Monthly Bandwidth
  • 20 Email Accounts
  • Unlimited subdomains

Enterprise$125

  • 10GB Disk Space
  • 100GB Monthly Bandwidth
  • 20 Email Accounts
  • Unlimited subdomains


<div class="row">
  <div class="twelve columns mobile-four mobile-twelve">
    
      <div id="pricing_table" class="clear pricing_4_col">
            <div class="pricing_section">
                <h3>Free<span>$0</span></h3>
                <ul>
                    <li><strong>10GB</strong> Disk Space</li>
                    <li><strong>100GB</strong> Monthly Bandwidth</li>
                    <li><strong>20</strong> Email Accounts</li>
                    <li><strong>Unlimited</strong> subdomains</li>
                </ul>
                <p><a class="signup">Sign up</a></p>
            </div>
            
            <div class="pricing_section">
                <h3>Basic<span>$25</span></h3>
                <ul>
                    <li><strong>10GB</strong> Disk Space</li>
                    <li><strong>100GB</strong> Monthly Bandwidth</li>
                    <li><strong>20</strong> Email Accounts</li>
                    <li><strong>Unlimited</strong> subdomains</li>
                </ul>
                <p><a class="signup">Sign up</a></p>
            </div>
            
            <div class="pricing_section">
                <h3>Advanced<span>$50</span></h3>
                <ul>
                    <li><strong>10GB</strong> Disk Space</li>
                    <li><strong>100GB</strong> Monthly Bandwidth</li>
                    <li><strong>20</strong> Email Accounts</li>
                    <li><strong>Unlimited</strong> subdomains</li>
                </ul>
                <p><a class="signup">Sign up</a></p>
            </div>
            
            <div class="pricing_section">
                <h3>Enterprise<span>$125</span></h3>
                <ul>
                    <li><strong>10GB</strong> Disk Space</li>
                    <li><strong>100GB</strong> Monthly Bandwidth</li>
                    <li><strong>20</strong> Email Accounts</li>
                    <li><strong>Unlimited</strong> subdomains</li>
                </ul>
                <p><a class="signup">Sign up</a></p>
            </div>
        </div>   
         
  </div>
</div>