From the course: CSS: Frameworks & Grids

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Exploring grid-based syntax

Exploring grid-based syntax - CSS Tutorial

From the course: CSS: Frameworks & Grids

Start my 1-month free trial

Exploring grid-based syntax

- [Tutorial Instructor] Since we've already looked at Foundation in this course, I'm going to walk through the syntax of their grid. Now every single grid system is going to be slightly different in terms of its syntax, but the basic concepts are going to be the same. So, if you learn how to use one grid, then moving to a different grid is really just going to be a matter of learning its syntax. And when I say syntax, I simply mean the class names instructor they use to create their grid. So, I'm here on the Foundation's grid documentation, and, here I can see that it is a 12 column nestable grid. We're going to talk about nesting in just a moment. So, the basic here is that you're going to have a containing element and you're going to give it a class of row, and this'll create a horizontal block with vertical columns. And for columns, you're going to use this columns class. In addition to the columns class, you're going to use another class that specifies how many columns that…

Contents