How do I recreate this element (box with a "save" tag on the top right corner) in webflow?

Design help General
1

Hey! :slight_smile:
I am struggling with recreating the box below. How do I create this odd corner and have it responsively cover the box’s corner?

Thanks a lot!

Fred

image
image

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

Hi @fredj32,

That corner is the combination of two containers. The white one is inside the light blue one. The white has a rounded corners configurations, while the the light blue has padding all around.

In mobile, just remove the padding of the light blue and you will be able to see the difference.

Let me know if this helps.

3

Hey Carlos,
Thank you for your reply. Actually, I have difficulties understanding what you mean. For clarification: The white one is what I have build in webflow so far and the blue one is the version I have in figma.
What do you mean with the padding?

4

@fredj32 Do you have the link for the project? THis way I can share a video about it.

5

Sure! https://preview.webflow.com/preview/octomo-landing-page?utm_medium=preview_link&utm_source=designer&utm_content=octomo-landing-page&preview=9e90aaae4c598004f497fd07251dc9dc&mode=preview

6

Hi @fredj32,

https://www.loom.com/share/6fc6eea94dc64456afbbf23df3cceef0

There you go!

Screen Shot 2020-08-11 at 2.42.48 PM

7

Wow, Carlos! That’s amazing! You are my hero!
Thank you so much. I wish you a wonderful week ahead. :blush: