Tagged: ,

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • February 3, 2024 at 11:13 am #1432872
    tbp

    Hi,
    I have a problem with the submenu container in mega menu. I´am using it with woocommerce and everytime if an item is in cart the submenu container shifts to the left.

    How can I make the submenu container full width?
    How can I prevent the submenu container shifting to the left if an item is in cart?

    Rgards
    Doro

    February 4, 2024 at 11:15 am #1432918
    Rikard

    Hey tbp,

    I’m not sure that I fully understand the problem you are having, please post a link to where we can see it. If you have screenshots highlighting it, then please share that with us as well.

    Best regards,
    Rikard

    February 5, 2024 at 5:47 pm #1433020
    tbp

    Hi,

    here is a link to a screenrecord that hopefully makes it clear what I mean.

    View post on imgur.com


    (mega menu not full width and shift to the left if an item is in cart)

    Best regards
    Doro

    February 6, 2024 at 10:59 am #1433203
    Rikard

    Hi,

    Thanks for that. Could you post a link to where we can see the actual problem as well please?

    Best regards,
    Rikard

    February 7, 2024 at 8:47 pm #1433554
    tbp

    Hi,

    I put a link for a live site in the privat content area

    Best regards
    Doro

    February 8, 2024 at 10:19 am #1433634
    Ismael

    Hi,

    Thank you for the update.

    We are not yet sure what is causing the issue, but you can temporarily fix it by adding this css code.

    .html_visible_cart #menu-item-2289 .avia_mega_div {
    opacity: 1 !important;
    display: block !important;
    left: -210px !important;
}

    Best regards,
    Ismael

    February 8, 2024 at 1:56 pm #1433688
    tbp

    Hey,

    thanks for that, but the code does not work for my needs.
    If I adjust the distance from the left it works to some extent, but only for exactly this part of a screen size
    the distances from the left and right are never the same, even with percentages.
    Even if I would make the adjustments for all screen sizes, I can’t create equal spacing left and right.

    Is there perhaps a way of automatically adjusting the width of the submenu to the screen size
    the spacing is always the same or the submenu is best extended to the full screen size?

    Best regards

    February 9, 2024 at 6:46 am #1433756
    Ismael

    Hi,

    Thank you for the update.

    The mega menu seems to adjusts correctly when we make it fullwidth. Please remove the previous css code, then replace it with:

    .html_visible_cart #menu-item-2289 .avia_mega_div {
    width: 100vw !important;
}

    If you want to make this the default width of the mega menu even when the cart is not visible, you can use this code instead.

    #menu-item-2289 .avia_mega_div {
    width: 100vw !important;
}

    This is how it looks: https://1drv.ms/i/s!AjjTfXSRbKTvgtw3azelDudoyrmGag?e=jsojMm

    Best regards,
    Ismael

    February 14, 2024 at 12:07 pm #1434281
    tbp

    Hi,
    thanks for that.
    The code works now for the mini cart ever visible, tha´s fine, but I have configure the cart only visible when an item is in cart.
    I ´ve tried to combine the sinippets but this did´t t work. Any idea for how can I handle the code for the cart only visible when an item is in cart?

    Best regards

    February 15, 2024 at 1:40 pm #1434408
    Ismael

    Hi,

    Did you remove the previous css code?

    .html_visible_cart #menu-item-2289 .avia_mega_div {
    opacity: 1 !important;
    display: block !important;
    left: -210px !important;
}

    Please remove the css code above, then add this one to make the mega menu fullwidth when the cart is visible. 

    .html_visible_cart #menu-item-2289 .avia_mega_div {
    width: 100vw !important;
}

    Or post the login details in the private field so that we can test the changes properly.

    Thank you for your patience.

    Best regards,
    Ismael

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