How to remove the outline when click button

I just biginner with Webflow. I am creating http://mebauxinhdep.webflow.io .
When click the search button, it show a blue out line around the button.
How to set remove it?
Thank you!

1 Like

Oh, great question @phanvietdo!

To remove the blue outline on focus will require the following small amount of CSS:
.search-button:focus {
outline: none;
}

You can view the effects of the CSS addition in the following video:

Feel free to learn about adding custom code at the following Webflow University article: Custom code in head and body tags | Webflow University

Also, you can learn more about the outline property in the following CSS-Tricks article: outline | CSS-Tricks - CSS-Tricks

Please note that you should add some form of proper fallback for accessibility: Quick tip: Never remove CSS outlines - The A11Y Project

Hopefully this helps :blush:

Best regards,
Micah :nerd_face:

2 Likes

Thank you. Can you tell me how to put my custom css into project. I am newbie with Webflow.

1 Like

Oh definitely, @phanvietdo.

No problem.

The following Webflow University article explains it the best:

Hopefully this helps :blush:

2 Likes

Awesome Ryan!
Thank you very much!

1 Like

@Port_of_Folio
I can do it now. Thank you all!

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