Streaming live at 10am (PST)

Button Hover BG Color different on Live than in Designer

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]

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

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

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

@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.

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:

Shared with CloudApp

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

Shared with CloudApp

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.

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

1 Like

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.