Can't remove blue outline with the new variant selector button when pressed or focused

Hey!

I’m having an issue with the new variant selector button feature that was recently released for ecommerce here in Webflow (see: Create new product shopping experiences with variant selector buttons | Webflow Features).

Whenever I select one of my variants, a blue outline appears. It doesn’t seem like it’s possible to disable it when editing the “pressed” or “focused” states in the designer. Also, the outline looks different in Chrome compared to Safari (see the provided screenshots), so I think it has to do with some unwanted line of code that can be disabled with some CSS…?

If anyone knows what causes this, I would greatly appreciate a response! Thanks!

SOLVED:

Enter these lines of code to the project head custom code section:

:focus { outline: 0; }
1 Like

Screenshot 2023-01-02 130727
Screenshot 2023-01-02 130738
Webflow automatically add the default styles on focus state