Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • May 24, 2016 at 5:28 am #637253
    pantoni

    Hi guys

    The footer menu (About / Terms / Contact), is not displaying on mobile phones. I can’t seem to find a setting in Admin to control this? Could you please check?

    Thanks

    May 24, 2016 at 8:30 am #637303
    Vinay

    Hey pantoni,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    
@media only screen and (max-width: 767px) {
.responsive #socket .sub_menu_socket {
    display:block!important;    
}}

    Best regards,
    Vinay

    May 25, 2016 at 3:30 am #637845
    pantoni

    Thanks Andy

    Please see screengrab below. The Footer menu is now displaying OK on mobile but 2 issues:

    1. Need it to display directly under Copyright
    2. Need it to left align with Copyright

    May 26, 2016 at 2:21 pm #638716
    Yigit

    Hi,

    Please add following code to Quick CSS as well

    @media only screen and (max-width: 480px) {
li#menu-item-6381 {
    padding-left: 0!important;
}

#socket .sub_menu_socket li {
    padding: 0 5px;
}}

    Best regards,
    Yigit

    May 27, 2016 at 2:00 am #639037
    pantoni

    Hi Yigit

    I’ve added that, cleared cache but both issues still persist.

    Thanks

    May 27, 2016 at 2:38 pm #639300
    Yigit

    Hi,

    Can you please try changing the code to following one

    @media only screen and (max-width: 767px) {
li#menu-item-6381 {
    padding-left: 0!important;
}

#socket .sub_menu_socket li {
    padding: 0 5px;
}}

    Best regards,
    Yigit

    May 28, 2016 at 2:24 am #639608
    pantoni

    Hi Yigit

    Still no luck unfortunately – here’s the total code I’ve got for the footer….

    @media only screen and (max-width: 767px) {
    .responsive #socket .sub_menu_socket {
    display:block!important;
    }}

    @media only screen and (max-width: 767px) {
    li#menu-item-6381 {
    padding-left: 0!important;
    }

    #socket .sub_menu_socket li {
    padding: 0 5px;

    May 30, 2016 at 7:07 am #640147
    Ismael

    Hi,

    Please add this code inside the css media query:

    #socket .menu {
    position: absolute;
    left: -8px;
    top: 40px;
}

    Best regards,
    Ismael

    May 30, 2016 at 7:14 am #640151
    pantoni

    Thanks Ismael

    That worked – just one small issue on desktop :)

    The footer menu ABOUT / TERMS / CONTACT is left aligned too far to the left beyond the line above and below.

    Please see screengrab below..

    Thanks

    May 30, 2016 at 10:47 am #640212
    Vinay

    Hi,

    Please replace the previous code with the one below:

    
@media only screen and (min-width: 767px) {
#socket .menu {
    position: absolute;
    left: 34px;
    top: 40px;
}
}

    Best regards,
    Vinay

    May 31, 2016 at 2:21 am #640653
    pantoni

    Hi Vinay

    Have done that and it fixed desktop, but has reverted the mobile view back to initial issues. And when slowly reducing browser width down in size, it’s not a consistent responsive reformatting. Just to confirm – here’s the total custom css for this:

    @media only screen and (max-width: 767px) {
    .responsive #socket .sub_menu_socket {
    display:block!important;
    }}

    @media only screen and (max-width: 767px) {
    li#menu-item-6381 {
    padding-left: 0!important;
    }

    #socket .sub_menu_socket li {
    padding: 0 5px;
    }}

    @media only screen and (min-width: 767px) {
    #socket .menu {
    position: absolute;
    left: 34px;
    top: 40px;
    }
    }

    June 1, 2016 at 2:59 am #641142
    pantoni

    hi Vinay

    Has been a bit too quirky getting this sorted so we’ve removed the footer menu for now.

    June 1, 2016 at 4:26 am #641172
    Ismael

    Hi,

    Has been a bit too quirky getting this sorted so we’ve removed the footer menu for now.

    https://www.dropbox.com/s/szg6dr6mtm560na/footer-02.jpg?dl=0

    It looks like that because you didn’t place the suggested code inside the css media query as instructed.

    #socket .menu {
    position: absolute;
    left: -8px;
    top: 40px;
}

    Best regards,
    Ismael

    June 1, 2016 at 1:15 pm #641452
    pantoni

    Hi Ismael

    As mentioned above – that code did not work, and subsequent changes. So we abandoned the footer menu

    Thanks.

    June 2, 2016 at 6:30 am #641854
    Rikard

    Hi,

    Ok, please let us know if you should need any more help on the topic.

    Regards,
    Rikard

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