Title: Focus Border issues
Last modified: June 11, 2023

---

# Focus Border issues

 *  Resolved [georgelambrianou](https://wordpress.org/support/users/georgelambrianou/)
 * (@georgelambrianou)
 * [2 years, 12 months ago](https://wordpress.org/support/topic/focus-border-issues/)
 * I have managed to change the focus outline across my site with simple CSS but
   it seems my search bar inside the Elementor widget container is showing a different
   focus outline colour compared to the rest of the site.
 * I have tried everything I could find to independently change the search focus
   border but nothing seems to effect this widgets focus.
 * I have attached the current CSS working for everything except the search.
 * [https://ibb.co/DrWkpL0](https://ibb.co/DrWkpL0) —> image link.
 * Help identifying my issue would be greatly appreciated!
 * Thank you,
 *  

Viewing 4 replies - 1 through 4 (of 4 total)

 *  [enmanueldiaz](https://wordpress.org/support/users/enmanueldiaz/)
 * (@enmanueldiaz)
 * [2 years, 12 months ago](https://wordpress.org/support/topic/focus-border-issues/#post-16812823)
 * Hello,
 * It sounds like you’ve got a stubborn CSS issue on your hands! The CSS selector
   you’re using might not be specific enough, or it’s possible that there’s another
   rule with higher specificity that’s overriding your desired style.
 * Elementor widgets have their own specific class names. Let’s try to target your
   search bar specifically. You’ll first need to identify the class name or ID of
   your search widget. To do this:
 * Open your website, right click on the search bar, and choose “Inspect” from the
   context menu. This will open the developer tools in your browser with the HTML
   for your page.
 * Look for the search widget’s unique class name or ID in the HTML. It might look
   something like .elementor-search-form or #elementor-search-widget, but the actual
   class or ID will depend on your site.
 * Once you have the class name or ID, you can use it to make a more specific CSS
   rule. For instance, if the class name is .elementor-search-form, you could do:
   .
   elementor-search-form input:focus {outline: 2px solid #F99B9B !important;}Remember
   to replace `.elementor-search-form` with your actual class name or ID. This rule
   should apply your desired focus outline to the search bar when it’s focused.
 * Remember, if you are using an ID, you should use `#` instead of `.`, like `#elementor-
   search-widget input:focus`.
 * Also, while using `!important` can help to override other styles, it’s generally
   a good idea to use it sparingly. If you can get your style to apply without `!
   important` by using a more specific selector, that’s usually a better approach.
   
   Best regards,
 *  [Neophytez](https://wordpress.org/support/users/lenarr/)
 * (@lenarr)
 * [2 years, 9 months ago](https://wordpress.org/support/topic/focus-border-issues/#post-17013995)
 *     ```wp-block-code
       .elementor-search-form--skin-minimal:focus-within {
           outline-width: 0 !important;
       }
       ```
   
 * Define as Global Custom CSS.
 *  [Erfan Azimi](https://wordpress.org/support/users/erfanath/)
 * (@erfanath)
 * [2 years, 4 months ago](https://wordpress.org/support/topic/focus-border-issues/#post-17405279)
 * tanks worked
 *  [saeedamini144](https://wordpress.org/support/users/saeedamini144/)
 * (@saeedamini144)
 * [2 years, 3 months ago](https://wordpress.org/support/topic/focus-border-issues/#post-17478001)
 * Thanks

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Focus Border issues’ is closed to new replies.

 * ![](https://ps.w.org/elementor/assets/icon-256x256.gif?rev=3444228)
 * [Elementor Website Builder - more than just a page builder](https://wordpress.org/plugins/elementor/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/elementor/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/elementor/)
 * [Active Topics](https://wordpress.org/support/plugin/elementor/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/elementor/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/elementor/reviews/)

 * 4 replies
 * 5 participants
 * Last reply from: [saeedamini144](https://wordpress.org/support/users/saeedamini144/)
 * Last activity: [2 years, 3 months ago](https://wordpress.org/support/topic/focus-border-issues/#post-17478001)
 * Status: resolved