Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • December 13, 2018 at 10:36 pm #1045045
    tonyiatridis

    Hi, I am building a new site for my client at nycartdirector.com/gaylemartz

    I’m seeing in mobile mode the menu icon over to the left a bit and overlapping the logo, rather then being below the logo or all the way to the right.

    I have this additional CSS to move the cart icon, but I think that has no bearing on the issue:

    #menu-item-shop.cart_dropdown {
    top: 67px!important;
    transform:translateX(-20%);
    }

    Can you have a look please?

    December 14, 2018 at 9:45 pm #1045455
    Victoria

    Hey tonyiatridis,

    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) {
  #menu-item-shop.cart_dropdown {
      top: 0px !important;
      transform: none;
  }
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    December 15, 2018 at 2:49 am #1045510
    tonyiatridis

    Hi Victoria,

    Actually it had no effect in either place. I’ve attached a screenshot link to illustrate the menu icon – logo overlap. If the logo was centered or full width and the menu icon and cart where below it that would be ideal.

    Thanks

    https://nycartdirector.com/gaylemartz/wp-content/uploads/2018/12/temp.png

    December 17, 2018 at 10:36 pm #1046572
    Nikko

    Hi tonyiatridis,

    Try adding this css code at the bottom of QUick CSS (located in Enfold > General Styling):

    @media only screen and (max-width:767px) {
  .responsive.html_bottom_nav_header.html_cart_at_menu #top #wrap_all .main_menu {
    right: -10% !important;
  }
}

    Flushing out cache maybe needed if you have a caching plugin.

    Best regards,
    Nikko

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