Site logo

Archived topic

Odd Looking shape/icon under search on mobile

6 replies · Started by Forum User on February 24, 2022

Viewing posts 1–7 of 7

There is an odd Looking shape/icon under search on the mobile version of this site https://www.tryhypnosisnow.com . Here is what it looks like https://postimg.cc/xNC7NQkR. Right above the mouse arrow amnd right below the search icon. I included the site CSS below.

#mobile-header img { width: 100%; height: auto; }
h1.entry-title {
display: none;
}
@media (max-width: 768px) {
    .page-hero {
        background-image: url(https://www.tryhypnosisnow.com/wp-content/uploads/2020/04/Hypnosis-NYC-for-quit-smoking-weight-loss-anxiety-phobias-confidence.jpeg);
    }
}
@media (min-width: 769px) {
    .main-navigation li.search-item {
        display: none !important;
    }
}
#mobile-header .inside-navigation {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.main-navigation .mobile-bar-items {
    order: 4;
}
input.ticket-selector-submit-btn {
background-color: #001de0!important; color: #fffff;
}
@media(max-width: 1024px) {
    .page-hero {
        display: none;
    }
}
@media(max-width: 768px) {
    .wp-block-image.small-image img {
        max-width: 150px;
    }
    .wp-block-image.small-image figure {
         text-align: center;
    }
}
@media (max-width: 531px) {
  #mobile-header {
      min-height: 154px;
  }
  .site-logo.mobile-header-logo {
    min-height: 93px;
    width: 100%;
  }
}
@media(max-width: 500px) {
  .wp-block-image .alignleft,
  .wp-block-image .alignleft img {
    float: none;
    width: 100%
  }
}

Hi there,

I'm actually seeing something different than the screenshot you've provided.

Can you disable Autopimize and any other caching plugins you might be using?

Thanks.

I disabled them.

Hi there,

Thank you for disabling them. The icon under the search bar seems to be coming from a plugin called Holler Box.

See: https://share.getcloudapp.com/JruG0myw

To remove this, can you try checking this plugin and see how it’s adding this? You can also try reaching out to their support for further guidance as to why it’s adding this element “before” the search icon.

Alternatively, though it's best to check this plugin's settings to resolve this issue, you can also try adding this CSS:

.icon-search:before {
    display:none;
}

Hope this helps! :)

Support for the plugin is limited so I used the CSS. That worked. Thank you Fernando.

Thank you.

You’re welcome! Glad to be of assistance! Feel free to reach out anytime if you’ll need assistance with anything else. :)

This archived topic is closed to new replies.