CSS Layout Masterclass
6h 49m 41s
English
Paid
What will you make? 11 CSS Layout. We will clone 11 beautiful layout of movie, e-commerce and portfolio website..
Read more about the course
What will you learn
Flexbox
- Main Axis / Cross Axis
- Column and Row
- align-self and order
- wrap, nowrap, reverse, align
- flex-grow, flex-shrink
- flex-basis
- many more...
Grid
- template areas
- rows and columns
- grid-template
- place-items
- auto-columns, auto-rows
- minmax
- auto-fill, auto-fit
- many more...
SCSS
- Variables
- Nesting
- Mixins
- Extends
Watch Online CSS Layout Masterclass
Join premium to watch
Go to premium
# | Title | Duration |
---|---|---|
1 | #0.2 Introduction | 04:18 |
2 | #0.3 What are we using | 01:44 |
3 | #1.0 Life Before Flexbox | 06:10 |
4 | #1.1 First Rule of Flexbox | 03:33 |
5 | #1.2 Main Axis and Cross Axis | 09:26 |
6 | #1.3 Column and Row | 06:01 |
7 | #1.4 align-self and order | 07:26 |
8 | #1.5 wrap, nowrap, reverse, align-content | 07:00 |
9 | #1.6 flex-grow, flex-shrink | 08:02 |
10 | #1.7 flex-basis | 03:37 |
11 | #1.8 Flexbox Froggy 1-13 | 06:27 |
12 | #1.9 Flexbox Froggy 14-24 | 12:00 |
13 | #2.1 Life Before Grid | 03:55 |
14 | #2.2 CSS Grid Basic Concepts | 06:07 |
15 | #2.3 Grid Template Areas | 07:12 |
16 | #2.4 Rows and Columns | 07:33 |
17 | #2.5 Shortcuts | 06:39 |
18 | #2.6 Line Naming | 03:44 |
19 | #2.7 Grid Template | 11:03 |
20 | #2.8 Place Items | 06:19 |
21 | #2.9 Place Content | 06:34 |
22 | #2.10 Auto Columns and Rows | 09:44 |
23 | #2.11 minmax | 02:58 |
24 | #2.12 auto-fit auto-fill | 05:23 |
25 | #2.13 min-content max-content | 06:24 |
26 | #2.14 Grid Garden part One | 08:40 |
27 | #2.15 Grid Garden part Two | 10:23 |
28 | #3.0 CSS Preprocessors and Set Up | 04:37 |
29 | #3.1 Variables and Nesting | 10:39 |
30 | #3.2 Mixins | 08:20 |
31 | #3.3 Extends | 05:22 |
32 | #3.4 Awesome Mixins and Conclusions | 13:00 |
33 | #4.0 Introduction | 02:31 |
34 | #4.1 Best Horror Scenes Coding | 17:37 |
35 | #4.2 Best Horror Scenes Comment | 05:30 |
36 | #4.3 Paint Box Coding | 18:58 |
37 | #4.4 Paint Box Comment | 04:53 |
38 | #4.5 10x19 Coding | 11:17 |
39 | #4.6 10x19 Comment | 03:55 |
40 | #4.7 Zoo Coding | 13:44 |
41 | #4.8 Zoo Commentary | 02:49 |
42 | #4.9 Schwartz Coding | 17:50 |
43 | #4.10 Schwartz Commentary | 05:19 |
44 | #4.11 Tolv Coding | 15:18 |
45 | #4.12 Tolv Commentary | 04:26 |
46 | #4.13 Rodic Davidson Coding | 06:21 |
47 | #4.14 Rodic Davidson Comment | 01:58 |
48 | #4.15 Beige Coding | 15:16 |
49 | #4.16 Beige Commentary | 02:58 |
50 | #4.17 Donica Coding | 09:11 |
51 | #4.18 Donica Commentary | 03:46 |
52 | #4.19 Canal Street Commentary | 07:14 |
53 | #4.20 Won Hundred Coding | 14:11 |
54 | #4.21 Won Hundred Commentary | 04:19 |
Similar courses to CSS Layout Masterclass

CSS Simplifiedwebdevsimplified.com
Category: CSS
Duration 15 hours 17 minutes 44 seconds
Course

Data Visualization + D3.jssuperhi.com
Category: JavaScript, HTML, CSS, D3.js
Duration 16 hours 48 minutes 54 seconds
Course

100 Days Of Code: The Complete Web Development Bootcamp 2024Academind Pro
Category: JavaScript, Sql, HTML, CSS, Node.js, Vue
Duration 78 hours 51 minutes 55 seconds
Course

Modern HTML & CSS From The Beginning CourseBrad Traversy
Category: HTML, CSS
Duration 24 hours 21 minutes 52 seconds
Course

CSS - The Complete Guide 2022 (incl. Flexbox, Grid & Sass)udemyAcademind Pro
Category: CSS
Duration 20 hours 54 minutes 47 seconds
Course

CSS Demystified: Start writing CSS with confidencekevin powell
Category: CSS
Duration 20 hours 45 minutes 24 seconds
Course

Crash Course: Build a Full-Stack Web App in a Weekend!udemy
Category: JavaScript, React.js, HTML, CSS
Duration 12 hours 13 minutes 30 seconds
Course

The Ultimate HTML5 & CSS3 Series: Part 1codewithmosh (Mosh Hamedani)
Category: HTML, CSS
Duration 2 hours 51 minutes 50 seconds
Course