Responsive Bento Grid CSS Tutorial - Frontend Mentor Challenge

Responsive Bento Grid CSS Tutorial - Frontend Mentor Challenge

Kevin Powell via YouTube Direct link

00:00 - Introduction

1 of 12

1 of 12

00:00 - Introduction

Class Central Classrooms beta

YouTube videos curated by Class Central.

Classroom Contents

Responsive Bento Grid CSS Tutorial - Frontend Mentor Challenge

Automatically move to the next video in the Classroom when playback concludes

  1. 1 00:00 - Introduction
  2. 2 00:20 - What we’re going to be creating
  3. 3 02:20 - Starting point
  4. 4 04:05 - Creating the grid
  5. 5 05:15 - Setting up the styling to make easy changes to the card
  6. 6 23:30 - Quick image fix using filter
  7. 7 26:45 - Image order and sizing
  8. 8 32:00 - Quickly going through the basic setup of the other cards
  9. 9 40:11 - Organizing our grid at larger screen sizes
  10. 10 47:00 - Adjusting the cards at the larger sizes
  11. 11 59:00 - Be careful reordering with CSS
  12. 12 1:01:50 - Fixing the layout at medium screen sizes

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.