Streaming live at 10am (PST)

Insert Codepen Inside A Specific Section/Container


#1

Hey everyone,

Brand new to Webflow and web design in general. I want to incorporate a few codpen designs into my website like this one: https://codepen.io/jscottsmith/pen/JNxyBL. I compiled the CSS/JS and placed the code in the header and footer of my page. After that I place an embed HTML box inside of the section where I want the animation to show. I tried different styling but no matter what I do the animation either takes over the whole screen or it only shows a fraction of the entire thing. Would be awesome to learn how to place it inside a specific section/container. Here is a link to the project that I just started: https://preview.webflow.com/preview/okaysoundsgood?preview=879b90537f3ac75cdc77d37b83c4d519

Thanks in advance for your help and please let me know if you need more info!


#2

Hi Willokay,
I have forked the codepen that you referenced and added a box around the canvas allowing to you change the size of the canvas. You can find the new code: Updated Codepen

Hope it helps.
Cheers,
Ben


#3

Works like a charm! Thanks Ben!
Cheers,

Will