Title: Mobile Overlay Problem
Last modified: June 17, 2024

---

# Mobile Overlay Problem

 *  Resolved [frangoaoalho](https://wordpress.org/support/users/frangoaoalho/)
 * (@frangoaoalho)
 * [1 year, 10 months ago](https://wordpress.org/support/topic/mobile-overlay-problem/)
 * Dear Kris & Fibosearch team,
   If I click the ‘search icon’ normally its fine, 
   but if I click it right in the corner of the ‘search icon’ in a mobile resolution(
   eg: 650px or 390px) it still triggers the search bar instead of the overlaying
   search box.This is very bad, as it increases the page size, because of the unwanted
   dropdown’s width.Also, everything is well setup in the settings, and I got a 
   load of CSS already slowing the website because of all the design incoherences.
   Can you please help me?
    -  This topic was modified 1 year, 10 months ago by [frangoaoalho](https://wordpress.org/support/users/frangoaoalho/).
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fmobile-overlay-problem%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

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

 *  [Kris](https://wordpress.org/support/users/c0nst/)
 * (@c0nst)
 * [1 year, 10 months ago](https://wordpress.org/support/topic/mobile-overlay-problem/#post-17829364)
 * Hi [@frangoaoalho](https://wordpress.org/support/users/frangoaoalho/)!
 * This CSS should fix the problem:
 *     ```wp-block-code
       html:not(.dgwt-wcas-overlay-mobile-on) .dgwt-wcas-search-wrapp.dgwt-wcas-layout-icon {	width: 20px;	height: 25px;	position: relative;	top: 2px;}
       ```
   
 * Paste it into Appearance -> Customize -> Additional CSS. If you aren’t familiar
   with custom CSS, take a look at [this video](https://www.youtube.com/watch?v=f0_6aeZEV58).
 * Regards,
   Kris
 *  Thread Starter [frangoaoalho](https://wordpress.org/support/users/frangoaoalho/)
 * (@frangoaoalho)
 * [1 year, 10 months ago](https://wordpress.org/support/topic/mobile-overlay-problem/#post-17830205)
 * I am going to paste it in a
 * `@media (max-width: 784px) {`
 * html:not(.dgwt-wcas-overlay-mobile-on) .dgwt-wcas-search-wrapp.dgwt-wcas-layout-
   icon {
   width: 20px;height: 25px;position: relative;top: 2px;}
 * `}`
 * And I am gonna heck if it works 🙂
   Appreciated Kris!
    -  This reply was modified 1 year, 10 months ago by [frangoaoalho](https://wordpress.org/support/users/frangoaoalho/).
 *  Thread Starter [frangoaoalho](https://wordpress.org/support/users/frangoaoalho/)
 * (@frangoaoalho)
 * [1 year, 10 months ago](https://wordpress.org/support/topic/mobile-overlay-problem/#post-17830221)
 * Yep, it did fix the problem indeed.
   Topic Resoved!

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

The topic ‘Mobile Overlay Problem’ is closed to new replies.

 * ![](https://ps.w.org/ajax-search-for-woocommerce/assets/icon-256x256.png?rev=
   2883754)
 * [FiboSearch - Ajax Search for WooCommerce](https://wordpress.org/plugins/ajax-search-for-woocommerce/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/ajax-search-for-woocommerce/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/ajax-search-for-woocommerce/)
 * [Active Topics](https://wordpress.org/support/plugin/ajax-search-for-woocommerce/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/ajax-search-for-woocommerce/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/ajax-search-for-woocommerce/reviews/)

 * 3 replies
 * 2 participants
 * Last reply from: [frangoaoalho](https://wordpress.org/support/users/frangoaoalho/)
 * Last activity: [1 year, 10 months ago](https://wordpress.org/support/topic/mobile-overlay-problem/#post-17830221)
 * Status: resolved