Responsive p5.js Canvas in Webflow (use as website background!)

In this video we will take a look at some tricks to ensure that the p5.js canvas is responsive when we use it in Webflow. Since the Webflow designer doesn't run javascript, we have to be deliberate about our CSS in designer and setup javascript to make sure we don't run in to any issues. I'll show you a bunch of ways to troubleshoot a number of common mistakes with Chrome developer tools.

// CLONE IT (affiliate link)
👯‍♂️ https://try.webflow.com/cloneable-is-...

// INSPIRATION
🏔️ https://www.peakspancapital.com/#post...

// FREE resources
✂️ Code Snippet Library: https://code-snippets-sign-up.webflow...
🤝 CSS Nobody Told You About: https://www.webbae.net/css-nobody-tol...
🚗 Roadmap to learn Webflow: https://www.webbae.net/roadmap-to-lea...

// Premium content
🤝 Patreon:   / webbae  
🕸️ Advanced Webflow Course (201): https://www.webbae.net/product/webflo...

// Discounts
🎢 Get 10% GSAP: WEBBAE10
♣️ Creative Coding Club (My favorite GSAP lessons): https://www.creativecodingclub.com/bu...

// Connect
🙋‍♀️ Join the Discord:   / discord  
🐥 Follow Me!   / webisbae  

// TOPICS COVERED

00:00 Intro
00:30 Setting the Canvas parent container
05:39 Adding content on top of our sketch
11:11 Non full-screen setups