ADVANCED CSS LAYOUTS
Forget floats—learn the layout techniques experts love & employers demand!
Does the thought of dealing with floats make you cringe? Do you have a decent grasp of CSS and want to know all the tips and tricks to making layouts that will land you the job? Are you unsure if your code is efficient enough, or feel like your layouts are so cookie cutter they come with chocolate chips? Then say CS-YES to learning Flexbox and CSS Grid.
CSS Grid has quickly risen through the ranks of essentials in every front end developer’s toolbox. CSS Grid takes the guesswork out of making layouts with intuitive, simple syntax. When you combine this with the versatility of Flexbox, you’ll unlock the superhero-level layout powers that will boost your portfolio—and your job prospects.
Prerequisites: A solid understanding of HTML & CSS is required
Advanced CSS Layouts
By the end of this class, you’ll be able to:
- Build websites using mobile-first responsive design.
- Structure a webpage and its content with CSS Grid or Flexbox.
- Control the order, position, and alignment of website content using Flexbox.
- Build intricate, responsive website layouts using CSS Grid.
- Use CSS units that will make automatic resizing a snap.
- Apply CSS selectors and CSS functions to style and resize HTML elements.
- Combine Flexbox and CSS Grid to create dynamic, responsive sites.
- Responsive site layouts
- CSS Grid
- CSS units
- CSS functions
- Complex CSS Selectors
Your Advanced CSS Layouts Portfolio
By the end of this class, you’ll have learned everything you need to code up advanced responsive layouts using the following skills:
Responsive Site Layouts
Responsive Site Layouts
Website layouts that automatically resize to the user’s screen
A CSS layout system for arranging page elements within a column or row
A CSS layout system for arranging page elements into columns AND rows
Snippets of reusable code used to quickly set values for CSS styles
More complex CSS code snippets used to target specific page elements like combinators and child selectors.
A technique for defining a size system for elements
After completing the program, you will earn:
The Skillcrush Advanced CSS Layouts Class
Official Certificate Of Completion
The perfect addition to your portfolio, your resume, AND your LinkedIn profile!
How Do I Know if This Class is For Me?
This Class Is For You If:
This Class Is Not For You If:
Your instructors are ALWAYS here to help.
Full Stack Instructor
Advanced CSS Subject Matter Expert
Will is a front end developer and the Development Team Lead here at Skillcrush. With a background in web design, he became a student at Skillcrush a few years ago to learn how to turn his designs into websites. From the Skillcrush platform to freelance projects, he has been turning amazing layouts into websites for years!
DIRECTOR OF CURRICULUM
Chelsea oversees curriculum development at Skillcrush. She’s developed and taught numerous courses in coding, design, freelancing, writing, editing, publishing, communication, and other professional skills.
Have a question? Our team of expert instructors is here for you around the clock:
GET HELPFUL FEEDBACK ON YOUR WORK
VIDEO CHAT IN GROUP Q&A SESSIONS
SHOOT US A QUICK EMAIL
With 1-on-1 support from your instructors & Skillcrush community, you’ll accomplish more than you ever thought possible.
Frequently Asked Questions
Do I need any previous tech experience to succeed in this class?Yes! Our Advanced CSS class is designed on the assumption that you’re familiar with HTML and CSS. If you’re not sure if your level of skill will be enough for the class, please send us an email at email@example.com to find out more. You don’t need to be an HTML and CSS expert, but you should be familiar with HTML and HTML5 tags and know how to code and style a simple website. If you’re an absolute beginner, you can start with our Front End Developer Course. There’s absolutely NO prior knowledge needed for that course, and it’ll prepare you very well for this class!
I’m a student in Skillcrush’s Coding Responsive Websites class. Will I learn anything new about Flexbox in this class?Yes! The Flexbox portion of the Advanced CSS Layouts class starts with a brief introduction and then dives into skills and techniques not covered in our Coding Responsive Websites class. You’ll also learn how to use Flexbox and CSS Grid together!
Does the Advanced CSS Layouts class build upon what I learned in Skillcrush’s HTML & CSS class?Yes! Our HTML & CSS class is designed to give you solid foundational skills in HTML and CSS and an understanding of how they work together to create basic websites. The Advanced CSS Layouts class dives deeper into using HTML and CSS together — and introduces new tools like Flexbox and CSS Grid — so you gain the skills you need to create more sophisticated layouts. It’s a major leveling-up of your coding skills!
What is CSS Grid?CSS Grid is a flexible layout system designed for controlling larger page layouts. It’s a much more flexible version of tables and floats and allows you to control the layout of items across multiple rows and columns. For example, you can use CSS Grid to align several stacked sections of a page next to a long sidebar. And yes — CSS Grid is perfect for responsive layouts!
What is Flexbox?Flexbox is a CSS layout system designed for controlling layouts along a single direction, meaning along a row OR a column. With Flexbox, you can use CSS properties to control the position and alignment of items within the layout. For example, you can use Flexbox to position buttons alongside one another in a navigation bar. Flexbox also reduces code complexity (say goodbye to floats!) and makes responsive layouts a breeze.
Does this class include mobile-first & responsive techniques?Yes! This class will teach you modern layout techniques using CSS Grid and Flexbox. With this knowledge, you’ll be able to create mobile-first, responsive websites!
How do you determine how long it will take to complete this class?Work, family, hobbies, life… we get it! Our time estimates are based on the assumption that you can spend about 1-2 hours a day on your classwork, including class projects. We feel confident that this is a reasonable amount of time to commit to learning new skills without having to turn your entire life upside down! At this pace, you should finish this class in 3-4 weeks.
How long will I have access to my class?Once you’ve completed payment for the class, you’ll have access to it for LIFE.
You don’t have to go back to school. You don’t need to be under 30, 40, or even 60. You don’t have to leave your job or take time off. You don’t even have to know a single thing about code—if you can download a file, you’re tech-savvy enough.
I used to work in retail and I just don’t see myself ever going back—my career outlook has completely changed! Now I am a Junior Developer at a small business that needs their site updated. I work directly with the Lead Developer to launch new products, debug issues, and alter styles for each viewport. The best part about my job is that I’m also being paid to learn!
My dream has literally come true and is really working. Now that I have tech skills, I work from home, earn a decent wage, spend time with my children, code (which I love), and continue to learn.
Sign up for your Advanced CSS Layouts class right now!
If you’re not completely satisfied within the first 14 days, we’ll give you a full refund.
Includes Lifetime Access!
Add-On for Front End, Web Design and Web Development Alumni
One Time PaymentEnroll Now
More Questions? We’re Here For You.
CHAT WITH US!
Want to talk in real time with a career counselor? Look for the chat box at the bottom right corner of this page.
EMAIL US ANYTIME
We’re always happy to answer any questions. Write us at firstname.lastname@example.org.