PHP Classes

File: src/assets/templates/css/hzgrid.css

Recommend this page to a friend!
  Classes of Luca Liscio   eXperience GuestBook   src/assets/templates/css/hzgrid.css   Download  
File: src/assets/templates/css/hzgrid.css
Role: Auxiliary data
Content type: text/plain
Description: Auxiliary data
Class: eXperience GuestBook
Application for users to send guestbook messages
Author: By
Last change:
Date: 9 months ago
Size: 2,123 bytes
 

Contents

Class file image Download
/* To change this license header, choose License Headers in Project Properties. To change this template file, choose Tools | Templates and open the template in the editor. */ /* Created on : 4-giu-2016, 17.30.40 Author : luca */ .hzgrid-container{ width: 100%; max-width: 1200px; margin: auto; } /*-- our cleafix hack -- */ .hzrow:before, .hzrow:after { content:""; display: table ; clear:both; } [class*='col-'] { float: left; min-height: 1px; width: 16.66%; } .col-1{ width: 4.166%; } .col-2{ width: 8.333%; } .col-3{ width: 12.5%; } .col-4{ width: 16.664%; } .col-5{ width: 20.833%; } .col-6{ width: 25%; } .col-7{ width: 29.166%; } .col-8{ width: 33.333%; } .col-9{ width: 37.5%; } .col-10{ width: 41.666%; } .col-11{ width: 45.833%; } .col-12{ width: 50%; } .col-13{ width: 54.166%; } .col-14{ width: 58.333%; } .col-15{ width: 62.5%; } .col-16{ width: 66.666%; } .col-17{ width: 70.833%; } .col-18{ width: 75%; } .col-19{ width: 79.166%; } .col-20{ width: 83.333%; } .col-21{ width: 87.5%; } .col-22{ width: 91.666%; } .col-23{ width: 95.833%; } .col-24{ width: 100%; } /*-- some extra column content styling --*/ [class*='col-'] > p { padding: 0; margin: 5px; vertical-align: middle; } @media all and (max-width:800px){ .col-1{ width: 33.33%; } .col-2{ width: 50%; } .col-3{ width: 83.33%; } .col-4{ width: 100%; } .col-5{ width: 100%; } .col-6{ width: 100%; } .row .col-2:last-of-type{ width: 100%; } .row .col-5 ~ .col-1{ width: 100%; } } @media all and (max-width:650px){ .col-1{ width: 50%; } .col-2{ width: 100%; } .col-3{ width: 100%; } .col-4{ width: 100%; } .col-5{ width: 100%; } .col-6{ width: 100%; } }