Creating box with circle and icon

Design help Layout & Design
1

Hi all, i would like to create a shape like this but im unsure how i can make it happen in webflow. The only method i know is to upload the box as an image and add in the text with webflow, but i don’t think that is the correct method to do so.

Is it possible to do this without CSS or coding?

Thanks guys!! Really appreciate all the help ! :grinning:

Group 324

2

Hi

First Step

image
image1915×1025 72.2 KB

Second Step

image
image1917×1032 72 KB

Third Step

image
image1919×1039 72 KB

Forth Step

image
image1920×1042 108 KB

blue highlighted text is setting for div block

Let me know if you any doubt

3

Hello @junglegymco thank you so much for the reply!
So it will be like i change the margin for the circle to overlap with the rectangle right?
What about the image? Do i place the image block on top of the circle ?

And may i know if this works with responsiveness ? Thank you again!

4

Hi

See setting inside the round div place image or icon set display setting to center center

image
image1795×938 117 KB

Also round div is place in round square and it has negative margin to set on top of round square.

Let me know if you still have questions.

5

Thank youuuuuuuu!! I have successfully created the same shape as intended! Why i never think of placing the circle in round square and the images in the circle haha, thanks so much!! Have a nice day :slight_smile:

6

You are welcome.
Can you mark this as solved.

Thank you!