Forum Replies Created

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • February 21, 2014 at 7:23 pm in reply to: Enfold: Menu problem on ipad #227623
    wizbiz

    Ok, I managed to make it work.

    The white layer issue is gone.
    On desktop, the header shows normally with a resolution over 989px.
    On tablet (between 768px and 989px), the regular menu shows, with smaller font, smaller logo, and reduced padding. Tested on ipad 2 and ipad mini.
    On smartphone (under 768px), it switches to the responsive menu.

    Here is the code:

    @media only screen and (max-width: 989px) and (min-width: 768px) {
.responsive .mobile_menu_tablet .main_menu {
display: block;
}

.main_menu {
margin-right: -30px;
}

.main_menu ul:first-child > li > a {
font-size: 10px;
}

.logo img {
width: 250px !important;
}
}

    I ended up removing the padding attributes, as it didn’t seem to make any difference.

    Thank a lot for your help!

    • This reply was modified 10 years, 9 months ago by wizbiz.
    February 21, 2014 at 7:20 pm in reply to: Enfold: Menu problem on ipad #227622
    wizbiz

    Thanks for your answer.

    If I use this CSS, the previous issue comes back, meaning that when loading the page, the menu appears for a second, and then disapear behind what looks like a white layer.

    But for the second it does appear, I can see the font parameter applied properly.

    Cheers.

    February 20, 2014 at 6:48 pm in reply to: Enfold: Menu problem on ipad #226952
    wizbiz

    Thanks, but unfortunately this didn’t change anything.

    Cheers.

    February 20, 2014 at 11:35 am in reply to: Enfold: Menu problem on ipad #226694
    wizbiz

    Thanks, with the modified java and the custom css posted by yigit this worked. Only problem left is that the size of the text won’t reduce like it used to.

    Here is the custom css I’m using:

    @media only screen and (max-width: 989px) and (min-width: 768px) {
.responsive .mobile_menu_tablet .main_menu {
display: block;
padding: 0 6px;
font-size: 10px;
}

.main_menu {
margin-right: -30px;
}

.main_menu ul:first-child > li > a {
padding: 0 11px;
}
}

    The “font-size” doesn’t apply. Any idea what I’m doing wrong?

    Cheers!

    February 19, 2014 at 3:52 pm in reply to: Enfold: Menu problem on ipad #226241
    wizbiz

    Hi,

    Thanks, but this displays the responsive menu when seen on tablet. I want to display the regular menu on tablet.

    To sum things up, I want to display:

    – the regular menu over 989px,
    – the responsive menu under 767px,
    – the regular menu with adapted logo width, font size and padding for everything between 768px and 988px.

    Basically what I used to do before, using the code I gave you earlier.

    Cheers.

    February 19, 2014 at 2:39 am in reply to: Enfold: Menu problem on ipad #225905
    wizbiz
    This reply has been marked as private.
  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)