Are you writing responsive CSS the wrong way?

Love the margin-left on one item, margin-right on the other to center. Had no idea.

I think people do desktop first because most of the time they dont have design for mobile at all and its easy to build something to look at in front of you and then make it smaller. Got into that trap myself, that cause so much trouble i never wanna do desktop first again

The layout example you gave is when I always feel like mobile-first would be less work. However, in the websites I've built in recent years, there are often more components that are displayed on desktop than mobile, or they look different, so I'd still need to write more media queries to hide and adjust these components, so I don't end up feeling like mobile-first would save me much time in the end. Additionally, where I work, I often get desktop mock-ups first or only. As a front-end dev, I often decide the mobile layout myself after building for desktop. Our clients are also mostly reviewing the sites on desktop first or only. I feel like as long as both layouts get the designer and developer's full attention and the developer feels productive, it shouldn't be such a divisive or single-answer topic.

Second time is a charm! Sorry if you have notifications on and it popped up twice, but I uploaded the first time without any video and didn't realize until after I published it!

I like to do desktop first because desktop is more complex and I have to consider different ways to build it. It just gives me a sense of control. It's easier to simplify the design for mobile later. I also usually make only desktop design in figma.

You're absolutely correct. I can only speak from my experience but by the time I learned my website was worthless without a mobile layout, it was too late. I had already spent months making this non-responsive desktop view. It took me twice as long to figure out how to make it responsive with all these media queries. I think going forward people will learn this way from the get-go. I only work on my personal site, so I put up with my bad habits, but if I was making this into a career I would have to relearn the right way.

People do desktop first mostly cause when they start learning css they learn and practice it for the desktop so they keep it going!!!!

New to coding, taking a college course, stressed about my final project, and this made the style sheet portion of my site feel much more approachable. Thank you!

"Create responsive columns without media queries" - your last 5 mins would be a great standalone video.

Well, it really depends on if you're developing something a B2C or a B2B application. B2B applications usually requires the code to run 100% properly on desktop (they're usually large scale applications that just happened use the browser as UI), while B2C applications usually requires the code to run 100% properly on mobile.

This video is golden, I've gone through a lot of tutorials and it never clicked to me that by default the design is so responsive!

I just started HTML and CSS and I am so grateful for this video

I do mobile first backwards. I start with desktop, but I write my styles as if I started with mobile.

Perhaps the question could have been, "SHOULD you do mobile first or desktop first?" I do desktop first because I've been doing web dev for 25 years, and only designing for mobile for the past 7 or 8. The habit is hard to break. But mobile first is much much better. Every time I build a site desktop first, it's such a pain to go back. But when I do mobile first, going to desktop is easier.

To me at least, it kinda doesn't matter whether I go desktop first or mobile (I'm a desktop first btw, because as you mentioned, that's just the way I learned). Either way I'm still making media queries to tweak the layout. Maybe it's a little easier for me to think about a layout shrinking and moving verses growing. When I'm coding, I'm thinking about those things anyway as I'm creating elements. "How is this part going to condense?" "Can I get away with fluid responsiveness here? Do I need break points?" etc. I do definitely see where you're going with this Kevin, and I'd like to try doing a mobile first layout just for kicks. But as for my experience so far, I'm not completely on board with the concept. But again, that's just me.

Forget CSS for a bit....when doing a layout I actually do it in XD first because I want my client to sign off on the design before I get into the html/css. I want to see how the desktop version looks...Then I can visually scale back to how it looks on a phone. Now if I design for mobile first, I have a one column design...so then how does the desktop version look? You have to add new things on to the desktop. Now for the CSS, I do it for mobile first. It takes getting used to, but not hard to do when writing media queries. If you're not using a desktop mockup to start with, this would get harder I think.

I'm going to start designing and coding using Powell Power.

I think the reason why ppl do desktop first is cuz most tutorials on media queries start with adjusting the layout for a mobile device. Also, ppl don't have the habit to design mobile first and start designing a desktop layout which can sometimes make it harder to rearrange so it fits in a mobile device. I personally first heard about mobile-first when doing your responsive web design bootcamp on scrimba and I definitely agree with you. It makes it so much easier!

I'm just starting with web dev and I'm capable of creating a responsive layout but it's such a looooong process. Starting from mobile layout might save me a ton of time and simplify it. Thanks for this video!

You don't need to convince me, you just need to remind me next time I start a project (I forget every time, I jsut cant get my brain to work the other way around)