

Next lesson playing in 5 seconds
CancelPractical CSS: Desktop to Mobile Navigation Patterns
Welcome
00:49
Creating a website navigation that looks the same on every screen is not really possible. Owing to the smaller screen size, mobile devices often require a different type of navigation.
In this short course, you’ll learn five different ways of converting a website navigation from a desktop format to something more suited to mobile.
Learn CSS: The Complete Guide
We've built a complete guide to help you learn CSS, whether you're just getting started with the basics or you want to explore more advanced CSS.
1.Introduction2 lessons, 04:45
2 lessons, 04:45
1.1Welcome00:49
1.1
Welcome
00:49
1.2A Simple, but Flawed, Approach03:56
1.2
A Simple, but Flawed, Approach
03:56
2.Simple Navigation Patterns3 lessons, 24:52
3 lessons, 24:52
2.1Pattern 1: Slide Down Menu07:28
2.1
Pattern 1: Slide Down Menu
07:28
2.2Pattern 2: Full-Screen Overlay08:03
2.2
Pattern 2: Full-Screen Overlay
08:03
2.3Pattern 3: Overlay Mega Menu09:21
2.3
Pattern 3: Overlay Mega Menu
09:21
3.Advanced Patterns2 lessons, 19:29
2 lessons, 19:29
3.1Pattern 4: Off-Canvas11:38
3.1
Pattern 4: Off-Canvas
11:38
3.2Pattern 5: Alternative Off-Canvas07:51
3.2
Pattern 5: Alternative Off-Canvas
07:51
Adi Purdila is a web design instructor for Tuts+. With over 100 courses and 200 tutorials published to date, Adi's goal is to help students become better web designers and developers by creating content that’s easy to follow and offers great value.
Being self-taught himself, Adi strongly believes that constant learning (academic or otherwise) is the only way to move forward and achieve your goals.
When not typing away at his keyboard, he loves woodworking and caring for his ever-growing family of rescue pets.
You can stay up to date with what he's doing by following him on social media or visiting his website at adipurdila.com.