This is the secondary heading

In this tutorial we’re going to build a website from scratch with 2 different layout modules from CSS. You can watch the video tutorial or read this article. It’s up to you.

Flexbox is only 1 of many things that you really need to know if you work with CSS, so you might be interested in the course I recently released. It combines everything that you need to know into 3 real-world projects that we’re going to code from scratch.

This is the secondary heading

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Non ipsam atque voluptas facere fuga dolorem possimus ut eveniet esse, vel quod magnam molestias culpa eos quae adipisci obcaecati. Placeat, qui? Ipsum, porro? Voluptatum natus delectus ipsum minus?

                    
                        // bad
                        var visible = true;
                        
                        // good
                        var isVisible = true;
                        
                        // bad
                        var equal = false;
                        
                        // good
                        var areEqual = false;
                        
                        // bad
                        var encryption = true;
                        
                        // good
                        var hasEncryption = true;
                    
                    
JavaScript
                    
                        .u-bold {
                            font-weight: 500;
                        }
                        
                        .u-bolder {
                            font-weight: 600;
                        }
                        
                        .u-italic {
                            font-style: italic;
                        }
                        
                        .u-mr {
                            margin-right: 3rem;
                        }
                        
                        .u-tr-left {
                            transform: translateX(-3rem);
                            display: inline-block;
                        }
                                
                    
main.scss

Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsum, porro? Voluptatum natus delectus ipsum minus?

By the way, if you really want to take your CSS to a professional level, I highly recommend going through my Professional CSS Course. We'll build 3 beautiful, real-world projects from scratch (see below). It's for people who have used CSS before but now want to upgrade their skill.

Take your CSS to a professional level

Get access to 3 real-world projects showing you how to code CSS like a pro

View course