Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
How FlexBox and CSS Grid replaces CSS Floats? with Example
Rating: 4.6 out of 5(46 ratings)
2,599 students

How FlexBox and CSS Grid replaces CSS Floats? with Example

CSS Floats are dead! It's time you check this video and learn about FlexBox (the present) and CSS Grid (the future).
Created byAbhilash PIllai
Last updated 3/2018
English
English

What you'll learn

  • Will be able to create layouts using CSS Floats, CSS FlexBox and CSS Grid
  • Will make you a powerful web designer/developer like a Front-End Developer on Steroids ;)
  • Ask me any doubts you have in my message box related to CSS and I will help :)

Course content

6 sections • 7 lectures • 59m total length

  • Introduction to CSS Floats, CSS FlexBox and CSS Grid1:54

    Compare CSS floats, flexbox, and CSS grid to craft web page layouts, showing why floats are cumbersome and how flexbox and grid offer neater, more efficient designs.

  • Why using CSS Floats is a Nightmare?1:27

    Explore why CSS floats pose challenges for beginners, including the hacky float:clear method, and learn how FlexBox and CSS Grid simplify wireframe layouts and responsive design.

Requirements

  • A Good Web Browser like Google Chrome, Mozilla Firefox or Safari ( No IE please )
  • A Good Editor like Sublime Text, Atom, Notepad++ or Brackets ( No Notepad please)

Description

You can't be a professional web designer/developer without the power of FlexBox and CSS Grid with you. If you already know the basics of HTML and CSS, this course is for you to give insights on how FlexBox and CSS Grid works in CSS. Both, FlexBox and CSS Grid is used to create layouts and arranging blocks/divisions properly. So if you hate floats, you will love this course for sure. 

With the power of FlexBox and CSS Grid under your belt, you will be a UI/UX designer on steroids to design any kind of layout. Further, FlexBox also has support in React Native, if you are Mobile app developer.

Covers:

  1. Creating layout using Float

  2. Creating layout using FlexBox

  3. Creating layout using CSS Grid

If you are using FlexBox for all your design needs in CSS then it's time you seriously consider using CSS Grid and you will know why when you take this short course. I have kept this short because time is valuable nowadays but it covers it all for you!

After completing the entire course if you have any doubts, feel free to ask me in my message box and I will help. If you are stuck in the middle of any project, feel free to ask me and I will do my best to troubleshoot.

Who this course is for:

  • Beginners with Basic Understanding of HTML and CSS
  • Especially those who struggle with CSS Floats or are looking for a easy way to arrange divisions
  • Curious students who want to learn about FlexBox or/and CSS Grid

Report abuse