Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • February 6, 2020 at 1:15 am #1181941
    theartninja

    Hello,
    Could you please look at the header I have now on website. I had previously received an answer on how to get the header to sit correctly on the page. Center logo with text on right and left then the menu is below. Now is good.

    But I need it to stack on the responsive mobile. Now all three items sit on top of each other when on mobile.

    Please look at site and let me know how to fix this issue.
    Thank you

    February 7, 2020 at 9:56 pm #1182422
    Victoria

    Hey theartninja,

    There is no space for the images on mobile and so should be hidden.

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
@media only screen and (max-width: 767px) {
  #header #media_image-3,
   #header #media_image-2 {
    display: none;
  }
  .container.av-logo-container {
    top: -10px;
}
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    March 18, 2020 at 9:09 pm #1194235
    theartninja

    Hi , thank you for this fix.
    This is working except on the ipad format. Do you have a suggesting to fix this? Ipad pro is working and all other formatted sizes except the ipad.

    March 19, 2020 at 7:33 am #1194321
    Rikard

    Hi,

    Please replace the previous code with this:

    @media only screen and (max-width: 1024px) {
  #header #media_image-3,
   #header #media_image-2 {
    display: none;
  }
  .container.av-logo-container {
    top: -10px;
}
}

    Best regards,
    Rikard

    March 27, 2020 at 6:45 pm #1198395
    theartninja

    This is working great.
    Also could you also please let me know how to make burger menu show on ipad pro size for 1024px.
    thank you,

    March 27, 2020 at 8:13 pm #1198418
    Jordan Shannon

    Hi,

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

    @media only screen and (max-width: 1024px) {
  nav.main_menu {
    display: block !important;
  }
  #avia-menu .menu-item {
    display: none;
  }
  .av-burger-menu-main.menu-item-avia-special {
    display: block;
  }
}

    Change the value 1024 to the pixel value of your choice.

    Best regards,
    Jordan Shannon

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