Quick guide to Foundation 5 : Handy code snippets

Foundation 5

 

 

Hi! today i’ll post some handy shortcuts to Foundation V5. Lets start with brief intro – The Latest version of Foundation Framework V5 was released by ZURB on 21 Nov. It is similar to foundation 4 with perfomace gaines and more developer tools. Transition are better and smoother in newest version thanks to fastclick.js and support of jquery instead of Zepto.

Before starting development using Foundation 5 make sure your majority end users fall under these broswer versions

Desktop: Chrome, Firefox, Safari, IE9+
Mobile: iOS (iPhone, iPad), Android 2.4 (Phone, Tablet), Windows Phone 7+, Surface

Without getting in much details of foundation 5 i’ll just post handy guide to it.

 

Single column class syntax

Two column class syntax

Row syntax

 

Gutter-free row syntax

 

Nested column syntax

 

Offset column syntax

 

Centered syntax

 

Ordering syntax

 

Four column mobile syntax

 

Block grids syntax

 

Visibility class syntax screen size based:

Visibility class syntax orientation based:

Visibility class syntax device based:

 

Visibility class syntax media queries syntax

 

Happy Coding with Foundation 5!

Tags: , , , ,