Payment method icons on mobile & tablet

  • Resolved kylanmint

    (@kylanmint)


    1 year, 1 month ago

    Hello,

    I tried changing the size of the payment method icons on the checkout for mobile & tablet but I cant seem to find the right selector for this. I want to make them smaller because they dont look aligned especially on iPhone because then Apple Pay will be added. Let me know !

    I already tried adding this to my Elementor custom code:

    @media (max-width: 425px) {
                            .mollie-gateway-icon svg, label .mollie-gateway-icon {
                                height: 30px !important;
                            }
        }

    @media (max-width: 1024px) {
    .elementor-widget-woocommerce-checkout-page .woocommerce-checkout #payment .payment_methods li label img {
    width: 45px !important;
    }
    }

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

Viewing 3 replies - 1 through 3 (of 3 total)
  • Saif

    (@babylon1999)

    Hello @kylanmint,

    Thank you for reaching out!

    The icons look proportionate on the mobile view from my end, did you figure it out? :?)

    Btw, the second snippet should target the elements:

    @media (max-width:1024px)
.elementor-widget-woocommerce-checkout-page .woocommerce-checkout #payment .payment_methods li label img {
/* increase/decrease size */
}

    Let us know if you need more helps!

    Thread Starter kylanmint

    (@kylanmint)

    Hello Saif,

    We managed to change it with max-width.

    Thank you for your response!

    Greetings,

    Kylan

    Plugin Support Shameem R. a11n

    (@shameemreza)

    Hi @kylanmint

    I’m glad you were able to find a solution to your inquiry here.

    I will be marking this thread as resolved. Should you have further inquiries, kindly create a new topic here.

    Thanks!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Payment method icons on mobile & tablet’ is closed to new replies.