Tagged: 

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • January 11, 2016 at 7:05 am #562927
    interfacemedia

    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

    January 11, 2016 at 5:21 pm #563360
    Yigit

    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

    January 12, 2016 at 7:42 am #563716
    interfacemedia

    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

    January 12, 2016 at 9:41 am #563765
    Basilis

    Hi!

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

    Regards,
    Basilis

    January 12, 2016 at 9:52 am #563773
    interfacemedia

    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

    January 13, 2016 at 5:29 am #564334
    Rikard

    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

    January 13, 2016 at 7:54 am #564391
    interfacemedia

    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

    January 14, 2016 at 3:29 pm #565427
    Andy

    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, 11 months ago by Andy.
  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.