Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • May 11, 2017 at 7:49 pm #791865
    charmedrunning

    Hello! I successfully found this code change to place the search bar into the secondary menu.
    https://kriesi.at/support/topic/move-search-to-top-bar-only/
    It worked great, but on mobile, the box is too far to the left for the user to see what he/she is typing. Is there a way to move it to the left or make it fully visible to the user?

    My site is http://www.charmedrunning.com

    Thank you!

    May 11, 2017 at 8:23 pm #791881
    John Torvik

    Hey charmedrunning,

    You can add this custom CSS code and let me know if all is okay:

    @media screen and (min-width: 480px) {
    .avia-search-tooltip {
      left: -63.5px !important;
      top: 22px !important;
    }
}

    Best regards,
    John Torvik

    May 11, 2017 at 10:49 pm #791962
    charmedrunning

    Hi John.

    I’m sorry. It didn’t work.

    I put the code in Quick CSS changes in the General Styling area. Should i be putting it somewhere else?

    May 12, 2017 at 12:19 am #791975
    charmedrunning

    Oh, I might add that I moved the search button to the secondary menu so I’m using Avia2…is that right? I tried changing that but it still didn’t work.

    May 12, 2017 at 12:51 am #791983
    charmedrunning

    OK…I followed your lead and did this in the custom css

    .avia-search-tooltip{
    position: absolute;
    z-index: 9999999;
    padding:0;
    width: 300px;
    top: 85% !important;
    margin-left: -30px;
    border-radius: 2px;
    box-shadow: 0px 3px 13px 0px rgba(0, 0, 0, 0.2);
    border-width:1px;
    border-style: solid;
    }

    I changed Margin-left from -120px to -30px and fixed it!!

    May 12, 2017 at 5:55 am #792059
    John Torvik

    Hi,

    I am glad that your problem was solved!

    Let us know if you have any issue :)

    Best regards,
    John Torvik

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.