English | MP4 | AVC 1280×720 | AAC 44KHz 2ch | 2h 44m | 477 MB
eLearning | Skill level: All Levels
Learn all the CSS Flexbox concepts and create a completely responsive design and elements – real-world hands-on training.
Before Flexbox arrived on the screen, we had to use relative or absolute positioning, floats clears and 100s of lines of code to achieve a decent website layout. All of that’s changed now. With CSS Flexbox, you can layout your website’s design in just a few lines of code, and even make it responsive! No more frameworks like Bootstrap to make up for the shortcomings in CSS. Become a professional web designer in just a few hours. If you know the very basics of HTML and CSS, you’re all set. Spend a few hours learning a bunch of Flexbox syntaxes, and you’ll be creating awesome web layouts in no time at all! You don’t need to learn a bunch of frameworks to become a pro web designer now! We’ll be using a real-world example to explain the concepts.
This course has 4 modules, where each module will thoroughly explain the intricacies of one of the concepts in Flexbox with a wealth of over-the-shoulder examples. The mini project at the start of the website where we create a real-world navigation/menu bar and make it completely responsive. A real world 2-column website with a responsive header, navigation bar, 2 columns (main content and sidebar) and footer. We’ll also make the entire website responsive.
What You Will Learn
- How to create a simple web layout with a header, footer, 2-3 columns with content and navigation bar without using floats or positioning properties.
- How to make your website into a full-blown responsive website, without using any external frameworks like Bootstrap.
- How to create widgets, carousels, applications, galleries, navigation bars, menu items
- How to control the position, size, and spacing of the elements you create without collapsing them.
- How to layout the elements of your website horizontally or vertically and change the alignments with a single line of code
- How to order elements on the page without changing their order in your HTML code.
- How to automatically change the width and heights of the elements so they fill up the space of their parent containers, without giving fixed dimensions.