Site logo

[Resolved] Display mini cart sub-menu problem

Home Forums Support [Resolved] Display mini cart sub-menu problem

Home Forums Support Display mini cart sub-menu problem

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #1708361
    Anthony

    Having trouble with my mini-cart dropdown. The “X” to remove the product from the cart seems off (could me some of my rouge CSS I need to clean up)?

    But, it also doesn’t drop-down when you hover over the cart icon unless you’re on a WooCommerce based page. Is that normal? See screenshots here:

    https://snipboard.io/6gwXUx.jpg
    https://snipboard.io/PZwFQ2

    Thanks in advance.

    -Anthony

    #1708427
    Anthony

    Seems like the Checkout Button and when you click on the cart icon they both redirect you to the homepage too. Weird, not sure where this is originating from.

    EDIT: I totally didn’t have the Cart or Checkout pages even made WHOOPS (I re-installed WooCommerce and assumed they were still pages)

    #1708455
    Ying
    Staff
    Customer Support

    Let’s fix the no cart/check out page issue first.

    This is how you add missing woocommerce page back:
    https://docs.woocommerce.com/document/woocommerce-pages/

    #1708464
    Anthony

    Thank you Ying,

    Just took care of this!

    #1708478
    Anthony

    Seems like it’s working now may have been my caching plugin which I just disabled. The “x” still seems off but maybe just a little CSS to fix that?

    #1708494
    Ying
    Staff
    Customer Support

    You have this css which set the line height to a very high value:
    https://www.screencast.com/t/2xEO2Oxh

    Lower the value to less than 18px should fix the problem.

    But I would recommend to use em instead of px for line height 🙂

    #1708500
    Anthony

    Funny I just removed that before I came to see your response. Now it still seems off. Are the cart items supposed to be Block or Inline? Looks weird still:

    https://snipboard.io/PxnbYe.jpg

    Thanky you!!!!

    #1708516
    Anthony

    Found this pesky code laying around:

    .inside-header ul {
    display: flex;
    align-items: center;
    flex-direction: row;
    }

    Thank you!

    #1708522
    Ying
    Staff
    Customer Support

    You have this CSS which messes the layout of mini cart:
    https://www.screencast.com/t/gKabxFa3

    I don’t think it’s needed based the current layout of your site header.

    Or you could use this CSS instead:

    .inside-header ul:not(.woocommerce-mini-cart) {
        display: flex;
        align-items: center;
        flex-direction: row;
    }

    Let me know 🙂

    #1708523
    Ying
    Staff
    Customer Support

    No problem 🙂

    Glad it works!

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