Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #895165

    Hey team kriesi,

    on mobile devices my menu displays 3 items – Logo, menu icon and cart icon.

    In the private content you can see a screenshot – is there a way to adjust them in order to get the cart icon to the right corner and have the menu icon more right to not overlap the logo?

    Currently, it looks a bit messy and we want it to look clean – my own solution would be to reduce the size of the logo.

    But adjusting would be much smoother;)

    Kind regards
    Marcel

    #895859

    Hey christwars,

    Yes, reducing the site logo would work, that is a nice idea! :)
    Go ahead with that it will get it short out.

    let us know if we can do anything else from our side.

    Best regards,
    Basilis

    #899054

    Hey there,
    it did work out but I am not totally happy with that.

    Is there a shortcode in order to adjust the cart icon to the right corner of the header (according to the logo to the left)?
    At least – we should move it by some px to the right corner – that could work out.

    Summarized, we need the cart icon to move a bit to the right on all screens.

    Important: Your prebuilt solution: “Let logo and menu position adapt to browser window” – does not work out and is not a good one for desktop.

    #900616

    Hi christwars,

    Could you please give us a link to your website, we need more context to be able to help you.

    Best regards,
    Victoria

    #901612

    Hey Victoria,

    of course – in fact, the issue is only based on the cart icon and it’s behavior on mobile.
    The icon moves in the header and does not stay centered on it’s place. In comparison to the menu icon (the 3 lines), the cart icon appears higher.

    See this issue on link in private data.

    • This reply was modified 6 years, 11 months ago by christwars.
    #901967

    Hi christwars,

    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

    
    #top #header_main #menu-item-shop .cart_dropdown_first .cart_dropdown_link {
        height: 75px;
        line-height: 75px;
    }
    

    If you need further assistance please let us know.

    Best regards,
    Victoria

    #903285

    Hey Victoria,

    your solution does not work – I think there might be a conflict with other CSS code already implemented.

    In private data you could take a closer look – that would be really nice of you.

    Best regards
    Marcel

    #904571

    Hi,

    Thank you for the info.

    Please use the following css code to adjust the position of the cart icon and the mobile menu.

    @media only screen and (max-width: 767px) {
        .responsive #top #menu-item-shop.cart_dropdown {
            margin-left: -39px;
            margin-right: -30px;
        }
    }

    Best regards,
    Ismael

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