1. Web Design
  2. CSS Grid Layout
Webdesign

Breaking the Grid With CSS Grid Layout

by
Lessons:7Length:47 minutes
CSS Grid LayoutCSSUI Design
Breaking the grid with css 400x277
For full access to all 7 lessons, including source files, subscribe with Elements.
  • Overview
  • Transcript

3.1 Final Thoughts

In this course, we’ve looked at how to build broken-grid layouts using the CSS Grid Layout model. Hopefully, you’ll be able to take what you’ve learned here and created some beautiful broken-grid layouts of your own.

1.Introduction
1 lesson, 00:36

Free Lesson
1.1
Welcome
00:36

2.Breaking the Grid
5 lessons, 46:13

Free Lesson
2.1
Grid Planning
11:06

2.2
Setting Up the First Grid
13:26

2.3
Laying Out the Elements
07:59

2.4
The Finished Layout
08:46

2.5
Responsive Considerations
04:56

3.Conclusion
1 lesson, 00:30

3.1
Final Thoughts
00:30

Craig Campbell
Craig Campbell
Craig has been doodling on computers since the first time he opened Paintbrush in Windows 3.0 in 1990. Since then, he has constantly sought new and exciting ways to make beautiful things on computers.
Unlimited Downloads
From $16.50/month
Get access to over one million creative assets on Envato Elements.
Over 9 Million Digital Assets
Everything you need for your next creative project.
Create Beautiful Logos, Designs
& Mockups in Seconds
Design like a professional without Photoshop.
Join the Community
Share ideas. Host meetups. Lead discussions. Collaborate.
Quick LinksExplore popular categories