How do I purposely overlap grid elements?

Design help General
1

I’ve looked at tutorials but can’t find exactly what I’m looking for. This is the look I’m going for, but I’m unsure how to set up my grid properly to have elements where I want them. The pink star, the yellow arrow, etc. I’m somewhat new, and normally would use absolute positioning but I want to use the flexibility of the grid. Appreciate any input!

Screen Shot 2021-01-24 at 7.45.04 PM
Screen Shot 2021-01-24 at 7.45.04 PM850×476 112 KB

Here is my site Read-Only: https://preview.webflow.com/preview/say-hey-studio?utm_medium=preview_link&utm_source=designer&utm_content=say-hey-studio&preview=663505f1e2a4ccfe42dcd85c3946ca43&mode=preview

2

Hi @sarbaar,

Not sure if grid would be the best solution here, for these elements I’d still go for absolute positioning.

Nevertheless, you can just use the grid layout for text elements and objects absolute positioning in a ‘relative’ div class.

Refer to the tips and tricks from Webflow university to get into Grid layout :slight_smile: