Tagged: 

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #562927

    Good Day Team,

    Firstly, thank you for an absolutely amazing theme! We had a lot of fun building our site with all the features the theme offered.

    I have however come across a little bug, and hope you can assist.

    The search icon displays perfectly on desktop view. But when the site responds to tablet and mobile, it disappears. Please can you assist in finding a solution so that the icon will display across all devices.

    Kind Regards,

    Joline

    #563360

    Hey interfacemedia!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    @media only screen and (max-width: 990px) {
    .responsive.html_mobile_menu_tablet .main_menu .avia-menu {
        display: block;
    }
    .av-main-nav li { display: none; }
    li#menu-item-search {
        display: block;
        right: 70px;
    }}

    Cheers!
    Yigit

    #563716

    Hi Yigit,

    Thank you so much for this. It worked perfectly, but as soon as you reach 767px and lower, a huge gap appears in the logo area.

    Any advice here would be much appreciated.

    Kind Regards,

    Joline

    #563765

    Hi!

    Can you please let us know which browser / device u are checking?

    Regards,
    Basilis

    #563773

    Hi Basilis,

    I work on Firefox and for mobile, iPhone S6 Safari. Looks like Chrome also has the same problem.

    Thanks for the quick reply!

    Kind Regards,

    Joline

    #564334

    Hi,

    Please try the following in Quick CSS under Enfold–>General Styling:

    @media only screen and (max-width: 767px) {
    #menu-item-search a {
        height: 10px !important;
        line-height: 0px !important;
        padding-left: 70px !important;
    }
    }

    Best regards,
    Rikard

    #564391

    Hi Rikard,

    Thanks for this.

    It looks much better! Is it possible to have the icon next to the menu toggle like we have on devices from 768px to 990px?

    I adjusted your code for this (I have it aligned with toggle), but struggling to position it next to the menu toggle?

    @media only screen and (max-width: 767px) {
    #menu-item-search a {
    height: 10px !important;
    line-height: 0px !important;
    padding-left: 70px !important;
    position: relative;
    top: -50px;
    }
    }

    Kind Regards,

    Joline

    #565427

    Hey!

    simply adjust right value for it:

    @media only screen and (max-width: 990px) {
    #menu-item-search {
    right: 165px; 
    }}
    

    Best regards,
    Andy

    • This reply was modified 8 years, 2 months ago by Andy.
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.