2. Developing the Grid & the FR Unit

In this tutorial we introduce you to the cutting edge CSS layout system called Grid Layout.

Grid Layout is gradually being implemented as standard in all the major browsers, and now is the time to learn how to use this powerful feature.

We learn how simple it is to create a DNN theme using CSS Grid layout. You’ll be surprised at how little CSS code we need to write, in comparison to previous layout techniques such as float. The CSS Grid technique is easier to understand, and more versatile than bulky CSS frameworks such as Bootstrap or Foundation.

This video contains:

• How to determine grid lines and gutters
• Creating a basic columns template
• How to determine row lines
• Creating a basic rows template
• Introduction to gutters
• Introducing the FR unit
• Dividing and using remaining space