Sliders with Text and shapes

I am new to Webflow and I need help with this underlapping layout in a slider. I am sure its simple to do, I’m just not sure how. This was designed in Figma. I want to be able to underposition the white ellipse under each of this words so I thought a parent div block with flexbox, within a div block for the first sentence and then a heading for the rest of the sentence might do the trick. Also I want a subtle animation so the whole thing appears smoothly.




Here is my site Read-Only: https://radial-ddbe4d.webflow.io/

Hi @pedromarroquin,

I made a demo site you can check out for the ellipse around the text. This just uses a span and then a border with a border radius of 50% - here’s the read only: Webflow - ellipse around span

Would you be able to send through your Read-only link to your so I can demonstrate this within your site?

Cheers

Hey @mww ,

Thanks for the demo! I think you cracked it. Never thought of just having a text block.
Yes, this is the read-only link,

Hi @pedromarroquin,

here’s a quick demo I recorded which will hopefully point you in the right direction: Radial - Loom Recording

Hope this helps!

1 Like

Hey @mww,
Thanks for the insight, definitely worked, didn’t knew about text spans before.

I have a follow up question that you might know how to solve…
I’m trying to make fluid responsive my site using the Timothy Rick’s Wizardry method, when I switch to tablet layout or smaller some things already re-size, but I can’t get the text to do the same, looks like something related to the line height or height of the spans and text blow…

Thanks in advance! :wave:

this is the read-only link