• Resolved scandidesignco

    (@scandidesignco)


    I found the css snippet to make the product thumbnails appear on the cart page on mobile but there’s 2 dots before them. How do I remove those and then right align the images on tablet & mobile?

    Tablet:

    Mobile:

    Thank you!

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Support Shameem R. a11n

    (@shameemreza)

    Hi @scandidesignco

    When you’re in responsive mode, editing this page on Elementor, you have the option to add this custom CSS, which will move the product thumbnail to the right:

    .elementor-widget-woocommerce-cart .woocommerce table.cart img {
      float: right !important;
    }

    Direct link: https://dsh.re/bb0bd4

    However, that dot is automatically added along with other information such as product, price, and label. If you choose to hide it, you’ll also hide other labels like products, prices, etc. But you can give this custom CSS a try to see whether it works or not:

    td.product-thumbnail::before{
        display: none;
    }

    Alternatively, I recommend getting in touch with Elementor support since you are using Elementor widget to build cart page. They might have different solution for this.

    Please note that writing or providing custom code or customization is not within the scope of our support policy. Therefore, if you need help with custom development or customization tasks, we recommend that you seek help from:

    I wish I could help more, but hopefully, this gets you going in the right direction to get the job done.

    Thread Starter scandidesignco

    (@scandidesignco)

    Thanks so much! For whatever reason, adding: td.product-thumbnail::before{ display: none; } didn’t remove the product title or name, just the dots – YAY!

    One more thing I’m hoping you can help me with. Above the product title it looks there’s about 20px of padding. How can I remove that so the product title is aligned with the thumbnail image? I looked under inspect element but I can’t find it.

    Hi there @scandidesignco ??

    Above the product title it looks there’s about 20px of padding. How can I remove that so the product title is aligned with the thumbnail image?

    Below, I am attaching a screenshot, referencing the related CSS. Feel free to edit, as needed.

    Direct link to image: https://snipboard.io/XF6TR7.jpg

    For anything further, feel free to reach out to Elementor’s support channel (linked here), as they would be in a better position to assist you.

    Cheers!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘How to remove dots before thumbnails on cart page on mobile?’ is closed to new replies.