Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • June 26, 2020 at 4:09 am #1225704
    navindesigns

    Hi,

    The hamburger menu does not show up on my site on a tablet – portrait format

    Building

    Please help

    June 26, 2020 at 3:32 pm #1225877
    Victoria

    Hey navindesigns,

    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 (min-width: 768px) and (max-width: 1024px) {
  .menu-item {
    display: none;
  }
  .av-burger-menu-main.menu-item-avia-special, #menu-item-search,
  .html_header_top .av_bottom_nav_header .av-logo-container .main_menu {
    display: block;
  }
  .av_minimal_header #header_main_alternate {
    display: none;
  }
  .html_header_top.html_logo_center .logo {
      left: 0%;
      -webkit-transform: none;
      -ms-transform: none;
      transform: none;
  }
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    June 26, 2020 at 4:59 pm #1225935
    navindesigns

    Unfortunately, that did not work on my end

    June 26, 2020 at 5:31 pm #1225950
    Victoria

    Hi navindesigns,

    Best regards,
    Victoria

    June 26, 2020 at 5:43 pm #1225954
    navindesigns

    did you click on the hamburger icon?

    nothing shows up

    June 27, 2020 at 5:23 pm #1226089
    Victoria

    Hi navindesigns,

    Oh, I thought your issue was visual.

    Please deactivate all plugins one by one to check which one is causing this issue and let us know if this solves the problem.

    Best regards,
    Victoria

    June 27, 2020 at 6:23 pm #1226102
    navindesigns

    I figured out the following CSS was causing the issue (I have removed it for now)

    @media only screen and (min-width: 768px) {
    .av-logo-container {
    position: absolute;
    top: -40px;
    left: 38%;
    transform: translateX(-38%);
    }
    }

    @media only screen and (min-width: 768px) {
    #header {
    padding-top: 25px;
    padding-bottom: 10px;
    background-color: rgba(0,0,0,0.4)!important;
    }
    }

    It was given to me by support to center the logo with the menu items. If you look on the desktop version now the logo is not centered with the menu items now since I just removed the code.

    can you provide the correct css for this now?

    Thanks

    July 1, 2020 at 4:19 am #1227072
    Rikard

    Hi,

    Thanks for the update and sorry for the late reply. The logo looks centered on my end, do you mean that the menu items should be vertically centered or do you want the logo moved down?

    Best regards,
    Rikard

    July 4, 2020 at 2:52 am #1227852
    navindesigns

    yes it should be moved down to be aligned with the menu items on the left and right so therefore the header section will be shorter in height

    thanks

    July 8, 2020 at 1:31 pm #1228859
    Ismael

    Hi,

    Thank you for the info.

    You can pull the mega menu upwards with this css code.

    #header_main_alternate {
	margin-top: -50px;
}

    Please don’t forget to toggle or disable the Performance > File Compression settings after adding the code.

    Best regards,
    Ismael

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