So, everything seems ok but the part in red right?
http://vincent.polenordstudio.fr/snap/v7e3m.jpg
There are empty elements in your design, and when you leave empty elements in your design, you’ll get differences between what you see in the designer and what you get online.
Why? Because to facilitate your work, Webflow is giving empty elements some specific, temporary style, that appear both in the designer and preview. In other words, an empty, unstyled DIV on a site is normally invisible and has no dimensions, but in the Webflow designer, it has a minimum size and a specific border.
Elements with the double border (4px gray border + dashed border) are empty divs, containers, row or sections etc.
http://vincent.polenordstudio.fr/snap/oh1ki.jpg
So it looks like the buttons is inside the div, but it’s not.
http://vincent.polenordstudio.fr/snap/2wx2m.jpg
And if I remove thet empty div, I get exactly what you get when you’re publishing your code:
So you have to delete those divs or give them a class name and some properties. I don’t give you more advices because I don’t know if you made a mistake or not. Feel free to tell us what you want to achieve exactly and we can tell you one of the best way to achieve it.
But here is my take on achieving the same visual result as you did, but with a simpler approach: (screencast video)
https://v.usetapes.com/KfwuVIQILe