Advanced Media Queries Using SCSS – Part 1, 2 and 3

By Raddy in CSS ·

In this series of tutorials, I will cover two advanced ways of doing Media Queries using SCSS. Before we do that, I will start with building a very basic HTML5 & CSS3 page using Visual Studio Code and then I will create a few media queries starting from mobile all the way up to desktop.

The media queries are the most important part of the series, so if you are not very familiar with how they work, this might be the perfect introduction for you. If you are a CSS GURU then, you can head straight to the second and third part of the video tutorials where we will focus on building the media queries using SCSS mixins. I also cover the basics of SCSS mixin’s in this video, so make sure you understand how they work before you start Part 2 and 3.

Part 1

Part 2

Part 3

You can download the source files from here. Unfortunately I haven’t commented the sections so you’ll have to reference the videos.

Helpful resources:

SOCIAL: @RaddyTheBrand 
Instagram: www.instagram.com/RaddyTheBrand
Twitter: www.twitter.com/RaddyTheBrand
Website: www.raddy.co.uk Blog: www.raddy.co.uk/blog
GitHub: https://github.com/RaddyTheBrand
Newsletter: www.raddy.co.uk/newsletter