HOME > Development > Applied CSS Grid and Flexbox -Build 7 Professional Web Pages

Applied CSS Grid and Flexbox -Build 7 Professional Web Pages

  • Development
  • Apr 30, 2025
SynopsisApplied CSS Grid and Flexbox -Build 7 Professional Web Pages,...
Applied CSS Grid and Flexbox -Build 7 Professional Web Pages  No.1

Applied CSS Grid and Flexbox -Build 7 Professional Web Pages, available at $19.99, has an average rating of 5, with 166 lectures, based on 1 reviews, and has 33 subscribers.

You will learn about Build Social media website, Video Tube, Social gram and a corporate website Gain more clarity on how to design industry standard and modern websites Understand how to ensure ALL web layouts have mobile design from large screen to very small screen Manipulate CSS Grid properties to build real-world web layouts Manipulate CSS Flexbox properties to build modern web layouts Learn how to fix code errors if you bump into them This course is ideal for individuals who are An intermediate learner of CSS properties, CSS Grid and Flexbox who wants to gain more clarity on how to design industry standard websites or A ready to learn enthusiast of web design or A creative mind who loves to learn step by step It is particularly useful for An intermediate learner of CSS properties, CSS Grid and Flexbox who wants to gain more clarity on how to design industry standard websites or A ready to learn enthusiast of web design or A creative mind who loves to learn step by step.

Enroll now: Applied CSS Grid and Flexbox -Build 7 Professional Web Pages

Summary

Title: Applied CSS Grid and Flexbox -Build 7 Professional Web Pages

Price: $19.99

Average Rating: 5

Number of Lectures: 166

Number of Published Lectures: 166

Number of Curriculum Items: 166

Number of Published Curriculum Objects: 166

Original Price: $199.99

Quality Status: approved

Status: Live

What You Will Learn

  • Build Social media website, Video Tube, Social gram and a corporate website
  • Gain more clarity on how to design industry standard and modern websites
  • Understand how to ensure ALL web layouts have mobile design from large screen to very small screen
  • Manipulate CSS Grid properties to build real-world web layouts
  • Manipulate CSS Flexbox properties to build modern web layouts
  • Learn how to fix code errors if you bump into them
  • Who Should Attend

  • An intermediate learner of CSS properties, CSS Grid and Flexbox who wants to gain more clarity on how to design industry standard websites
  • A ready to learn enthusiast of web design
  • A creative mind who loves to learn step by step
  • Target Audiences

  • An intermediate learner of CSS properties, CSS Grid and Flexbox who wants to gain more clarity on how to design industry standard websites
  • A ready to learn enthusiast of web design
  • A creative mind who loves to learn step by step
  • Are looking to learn Web Design projects with Grid and Flexbox? Do you want to build standard web layout projects and upgrade your skills in CSS properties, CSS Grid and CSS Flexbox? Then this is the RIGHT COURSE for you! This is an impressive and comprehensive course. EVERY CONCEPT you need to know how to layout crisp and modern web designs will be explained step by step.

    You will practically and creatively learn how to build/design a responsive:

    (1) Social media websites (Instagram-like and Facebook-like website)

    (2) Video Tube website (YouTube-like website)

    (3) Corporate website

    (4) Chat App Design

    (5) Online CV Design

    In this awesome course you will build practical web designs. All the projects will be well explained, appropriately discussed and taken step by step. This web design layouts will be well structured step-by-step.

    PamchTutor is here to teach you how to manipulate CSS properties like Absolute, Relative, Sticky, Fixed Positioning.You will also learn how to create RESPONSIVE Navigation Bars with drop down menus. As if that is not enough, you will learn how to use FLEX BASIS, GAP,  GRID-AUTO-ROWS, MINMAX(), REPEAT(), AUTO-FILL/AUTO-FIT, JUSTIFY-CONTENTS, ALIGN-CONTENTS, GRID-COLUMN, GRID-ROW, MEDIA QUERIES.

    Get started today and begin a new journey to gain new perspective on how to design responsive and industry ready and premium websites. It is time to learn how to design A WHOLE LOT of web design layouts by yourself.

    After finishing this SIMPLIFIED and PRACTICAL COURSE, you will be skilled on how to take on any challenge to build ready-to-launch, responsive, comprehensive, and professional websites that comes to your mind.

    Course Curriculum

    Chapter 1: Introduction

    Lecture 1: Course Introduction – 1

    Lecture 2: Course Introduction – 2

    Chapter 2: Project 1 – Social Media Project

    Lecture 1: Introduction to Social Media Project

    Lecture 2: Setting up for the project

    Lecture 3: Basic structure of the navigation

    Lecture 4: Structuring the Navigation

    Lecture 5: Adding Font Awesome to the navigation

    Lecture 6: Styling the search bar

    Lecture 7: Styling the sideMenu and online icon

    Lecture 8: Creating the submenu drop down

    Lecture 9: Styling the icons in the submenu

    Lecture 10: Styling the submenu-1

    Lecture 11: Styling the submenu of sideMenu

    Lecture 12: Responsiveness of Navigation – Part 1

    Lecture 13: Responsiveness of Navigation – Part 2

    Lecture 14: Responsiveness of Navigation – Part 3

    Lecture 15: Responsiveness of Navigation – Part 4

    Lecture 16: Responsiveness of Navigation – Part 5

    Lecture 17: Responsiveness of Navigation – Part 6

    Lecture 18: Responsiveness of Navigation – Part 7

    Lecture 19: Structuring the Web Layout Content

    Lecture 20: Styling the Web Layout with Flex

    Lecture 21: Styling the Footer

    Lecture 22: Styling the Web Layout with Grid

    Lecture 23: Understanding auto in a Grid item and flex item

    Lecture 24: Responsiveness of the Layout – Part 1

    Lecture 25: Responsiveness of the Layout – Part 2

    Lecture 26: Responsiveness of the Layout – Part 3

    Lecture 27: Rounding up Responsiveness of Layout

    Lecture 28: Main Content – Story Line – Part 1

    Lecture 29: Main Content – Story Line – Part 2

    Lecture 30: Main Content – Story Line – Part 3

    Lecture 31: Main Content – Post Line – Part 1

    Lecture 32: Main Content – Adding Unicode to <select>

    Lecture 33: Main Content – Post Line – Part 2

    Lecture 34: Main Content – Post Line – Part 3

    Lecture 35: Main Content – Write Posted – Part 1

    Lecture 36: Main Content – Write Posted – Part 2

    Lecture 37: Main Content – Write Posted – Part 3

    Lecture 38: Main Content – Write Posted – Part 4

    Lecture 39: Left Content

    Lecture 40: Right Content – Part 1

    Lecture 41: Right Content – Part 2

    Lecture 42: Right Content – Part 3

    Lecture 43: Right Content – Part 4

    Lecture 44: Right Content – Part 5

    Lecture 45: Understanding Order property as used in this project

    Lecture 46: SocialSite Project Wrap Up

    Chapter 3: Project 2 – Video Tube Project

    Lecture 1: Introduction to VideoTube Project

    Lecture 2: Creating a basic structure

    Lecture 3: Basic grid layout and scrollbar track

    Lecture 4: The grid layout of the site

    Lecture 5: Responsiveness of the grid layout

    Lecture 6: Inserting top video and content paragraph

    Lecture 7: Structuring the user profile

    Lecture 8: Styling the user profile and image-side

    Lecture 9: Styling the likes-side

    Lecture 10: Styling the ellipsis and the responsiveness of user-profile

    Lecture 11: Building and styling the views

    Lecture 12: Show Less-Show More

    Lecture 13: Chapters

    Lecture 14: Aside Videos – Part 1

    Lecture 15: Aside Videos – Part 2

    Lecture 16: Aside Videos – Creating duplicates of videos

    Lecture 17: Structuring the Comments

    Lecture 18: Styling the Comments

    Lecture 19: Comments – creating duplicates of comments

    Lecture 20: Navigation structure – part 1

    Lecture 21: Navigation structure – part 2

    Lecture 22: Navigation styling – part 1

    Lecture 23: Navigation styling – part 2

    Lecture 24: Responsiveness of Navigation – Part 1

    Lecture 25: Responsiveness of Navigation – Part 2

    Chapter 4: Project 3 – Corporate Site Project

    Lecture 1: Basic Structure of the site

    Lecture 2: Navigation and slider grid layout

    Lecture 3: Whole page GRID layout

    Lecture 4: Spanning and arranging the grid items

    Lecture 5: Footer grid layout

    Lecture 6: Structuring the Navbar

    Lecture 7: Styling the navbar

    Lecture 8: Responsiveness of navbar

    Lecture 9: Structuring the slider

    Lecture 10: Styling the slider – part 1

    Lecture 11: Styling the slider – part 2

    Lecture 12: Structuring and styling the contents in the page

    Lecture 13: Duplicating the contents in the page

    Lecture 14: Footer Styling

    Lecture 15: Making some adjustments to navigation

    Lecture 16: Animated circles – part 1

    Lecture 17: Animated circles – part 2

    Lecture 18: Fixing the content with minmax()

    Chapter 5: Project 4 – PAMCHGram Project

    Lecture 1: Introduction to pamchgram project

    Lecture 2: Basic Structure of the site

    Lecture 3: Structuring the navigation

    Lecture 4: Styling the Navigation

    Instructors

  • Applied CSS Grid and Flexbox -Build 7 Professional Web Pages  No.2
    Pamch Tutor M.Ed
    Educational Technologist | Bestselling Trainer | M.Ed
  • Rating Distribution

  • 1 stars: 0 votes
  • 2 stars: 0 votes
  • 3 stars: 0 votes
  • 4 stars: 0 votes
  • 5 stars: 1 votes
  • Frequently Asked Questions

    How long do I have access to the course materials?

    You can view and review the lecture materials indefinitely, like an on-demand channel.

    Can I take my courses with me wherever I go?

    Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!