Button Hover BG Color different on Live than in Designer

[dascal_visual (Adrian Dascal)]

Hey hello guys,

I come to you with a weird effect. I have a button that on hover should become white. On the live website however it becomes yellow. I have checked:
-all the hover states (from links to other buttons and CTA items).
-custom code I’ve written as well to see if I influence the global buttons…

The weirdest part is that I haven’t used the yellow color as hover anywhere…

I have tried to simply add a Background color on the hover state and doesn’t change anything on the live version. Here are screenshots:

Thank you in advance!

Here is my site Read-Only: [LINK]

[cyberdave (Dave S.)]

Hi @dascal_visual, thanks for your post.

I am showing the site was last published yesterday from the published html timestamp, is it possible for you to do a site publish to the domain which is not being updated and share a link to that page directly to help check?

From the read only link, things look ok to me, the site may need a publish.

Thanks in advance

[dascal_visual (Adrian Dascal)]

Thank you for the quick reply! For sure here is the staged Website

[cyberdave (Dave S.)]

Hi @dascal_visual, great, could you also publish the site once to make sure all the latest style updates have been published.

See how to “Publish your Webflow project”

Thanks in advance

[dascal_visual (Adrian Dascal)]

@cyberdave, I just published it

The interesting thing I observed is that if I add a combo class and change the hover background color then it works and the yellow color doesn’t show.

[cyberdave (Dave S.)]

Hi @dascal_visual, thanks for your reply.

It looks like there is an override style for the 1280px viewport which has been created at one time. I can see that this hover style with yelllow background is defined at the 1280px breakpoint:

I tested on 1279px viewport and that renders the hover color correctly:

I am not exactly sure how that larger viewport override style has been set, but I am looking in to it, I have not yet been able to reproduce, it could be this element was copied and pasted from a source where the 1280px viewport was already created.

I would recommend to create the 1280px breakpoint on the project then remove the hover background color at the 1280px viewport.

If the issue happens again, let me know.

[dascal_visual (Adrian Dascal)]

Thank youuu. Yes I copied it from a website to make the process faster.