YoVDO

Creating Simple Layouts - Comparing Flexbox and Grid Approaches

Offered By: Kevin Powell via YouTube

Tags

CSS Grid Courses Web Design Courses Flexbox Courses Responsive Design Courses Subgrid Courses

Course Description

Overview

Save Big on Coursera Plus. 7,000+ courses at $160 off. Limited Time Only!
Explore various approaches to creating a simple layout in this insightful video tutorial. Analyze the strengths and weaknesses of different techniques submitted by a Discord community, including flexbox, grid, and even tables. Discover how to effectively use flex and grid for main layouts and card arrangements, and learn about innovative solutions like using flex with margin adjustments and creating two-column card layouts. Compare multiple flex solutions, examine a grid approach, and delve into the grid vs. flexbox debate. Gain valuable insights on subgrid implementation and look forward to future layout challenges. Perfect for web developers seeking to enhance their CSS layout skills and understand the nuances of different design approaches.

Syllabus

- Introduction
- Flex or grid for the main layout
- Flex or grid for the layout of the cards
- Using flex on top and a margin-left on the bottom
- Using flex to make two columns inside the card
- Comparing the two flex solutions
- A grid solution
- Grid vs. Flexbox discussion
- Subgrid solution
- More challenges coming


Taught by

Kevin Powell

Related Courses

HTML5 and CSS Fundamentals
World Wide Web Consortium (W3C) via edX
Build Responsive Real-World Websites with HTML and CSS
Udemy
HTML5 & CSS3 Course: Build Responsive Websites from Scratch
Udemy
Advanced CSS and Sass: Flexbox, Grid, Animations and More!
Udemy
Modern HTML & CSS From The Beginning 2.0 (2024 Revamp)
Udemy