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 - CSS Tutorial
From the course: CSS: Frameworks & Grids
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…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.