From the course: Responsive Layout

Unlock the full course today

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

12-column layout setup

12-column layout setup - HTML Tutorial

From the course: Responsive Layout

Start my 1-month free trial

12-column layout setup

- [Instructor] One of the great things we can do with CSS Grid is use it for layout instead of one of those many layout frameworks that have been so popular the last few years. Although frameworks can be useful, the way they've been used to build Grid type layouts tends to create a lot of extra, and unnecessary code. Now that CSS Grid is available to us, it's much easier to create your layout directly in CSS. In the next three videos we're gonna look at how to create a 12 column responsive layout. That doesn't mean that users will see 12 columns on the page it means that the layout is visually based on 12 columns which can be grouped together to create wider columns. This is a classic graphic design technique that gives a visual structure to the page. Going over to the code, we're going to start out by designing for narrow view port. So I'm gonna make the window a little bit narrower, and we have a div with a class of container surrounding everything, that's on line 15. We have a…

Contents