Jump to content

Dear members, finally, we decided to refresh our theme. Decision was brought based on multiple factors, primarily because of technical needs as old one is not compatible with a new platform version, but also because you all asked for a darker theme.
Here you go!

Please head here if you want to vote https://www.elite7hackers.net/topic/411861-the-new-theme/


This site uses cookies! Learn More

This site uses cookies!

For providing our services, we do use cookies.
But get used, this is what most of modern web do!
However we have to warn you since we are obligated to so due to EU laws.

By continuing to use this site, you agree to allow us to store cookies on your computer. :)
And no, we will not eat your computer nor you will be able to eat those cookies :P

Sign in to follow this  

The Complete CSS Flexbox Guide With a Complete Project 2018

Recommended Posts


The Complete CSS Flexbox Guide With a Complete Project 2018
.MP4 | Video: 1280x720, 30 fps(r) | Audio: AAC, 44100 Hz, 2ch | 1.36 GB
Duration: 2.5 hours | Genre: eLearning | Language: English
understand the concept behind css flexbox and create a real world project with complex responsive layouts using flexbox.

What you'll learn

understand everything about flexbox and how it actually works
build advanced responsive layouts fast and easily with minimal code using flexbox
build menus using flexbox
build a complete website with advanced responsive layouts like ( the holy grail layout - the equal columns layout - the horizontal masonry layout ) and so much more!
enhance your productivity and save more time as a web developer
build photo galleries using flexbox


An Internet Connection
Basic Understanding Of HTML & CSS
Any Code Editor Of Your Choice


Are you tired of using floats then clearing these floats ?

Are you tired of using positioning to achieve the layout you want and then finding out that the everything collapses when you view it on different screen sizes ?

do you want an efficient way to create complex layouts easily and quickly ?

do you want to create advanced responsive layouts using css only with just simple lines of code ?

if so then this course is for you !

In this course you will learn everything you need to know to get started using flexbox in your future projects

We will start by learning and understanding how flexbox works, because I think if you used flexbox before you might be overwhelmed by the number of new properties, we have about 11 or 12 new properties with an average of 4 potential values so it can be a little bit overwhelming to jump right in with everything,

but in this course you will clearly understand how every property works and how a specific property can be used to control the layout in different ways

I believe in learning by doing so after understanding and learning all the properties of flexbox we will get our hands dirty and we will start by building two menus, a simple single level menu and an advanced one and in this section of the course you will see every thing you learned in action step by step

One thing I put in my mind when I was building this course is that I wanted this course to stand out from other courses so I noticed that in all other flexbox courses you will just see some boxes on the screen all the time and the instructor is just moving them around using flexbox and at the end, the course will be finished and you become like "ok that was good i learned the basics of flexbox but now what? How can I use this knowledge in real world examples"

because after all the web pages are not some boxes moving around, right ? and that is exactly why I created the last section of the course.

So in this last section we will build a complete project from scratch that I built for you , and my main focus while I was building this project is how to implement every property we will learn about flexbox in this project so you get a solid understanding of what we can do using these properties in real life!

So in this project you will learn how to create many advanced different layouts like

1 - the holygrail layout

2 - you will learn how to center elements vertically easily

3 - how to build posts articles with equal heights easily using flexbox

4 - very advanced cards layouts that is almost impossible to attain without flexbox

5 - the horizontal masonry layout which is very interesting

Who is the target audience?

web designers and developers who want to improve their skills
front end web developers who wants to be able to build advanced layouts easily and faster
web developers who want to build responsive layouts without having to use frameworks like bootstrap
experienced web developers who want to create websites layouts in a much more easy way
any web developer who wants to improve his productivity and save time


Download link:




Links are Interchangeable - No Password - Single Extraction

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

Elite7Hackers Netwok

Hack the imagination!

Support and inquiries

Open support ticket here or email us at [email protected]


Highlighted/recommended lights


Important Information

By using this site, you agree to our Privacy Policy and Terms of Use.