CSS Tip 📖 Use CSS shape-outside to wrap text around shapes .column--left .shape { float: right; shape-outside: circle(100px at 100% 50%)); }

Here's the @CodePen link! 🤙 The trick is to use 2 columns with two elements for shape-outside, a semi-circle for each column 📖 Then you can power it with custom properties as seen in the video above 😎

The only "caveat"? 👀 You're limited in how you use it. You need to split your content into columns manually 🙃 It doesn't play nice with column-count Not the end of the world though and would look nice on some landing pages etc. 🤙

Now make the DVD screen saver bouncing thing and the text wraps around it to let it pass

Woah 😲✨ Is it all static elements(2 cols and circle) , I mean by position

Bro nailed it

Shape-outside ? CSS is insane. What's left to add ?

service 🔥

Should change my bio 😅 "Demos as a service" "Tag me and demos will follow"

I wonder if it works with images, I could see some cool stuff being created with this.

Seeing float