[Support request] Custom CSS

[Renaldo]

Perfect that works perfectly thanks alot.

Can you please assist me with CSS for our cart to display thumbnail. As it not showing in mobile with the theme. Please see example of what we are after on mobile. https://postimg.cc/gallery/16v2bc5uo/

Here is our link https://botthmsv2.kinsta.cloud/?page_id=17

[David]

Try this:

@media (max-width: 768px) {
    .woocommerce table.shop_table.woocommerce-cart-form__contents td:before {
        content: '';
    }

    .woocommerce table.shop_table_responsive tr.woocommerce-cart-form__cart-item {
        display: grid !important;
        grid-template-columns: 50% 50%;
        padding: 20px 10px;
        border: 0.5px solid
    }

    .woocommerce table.shop_table_responsive tr.woocommerce-cart-form__cart-item>* {
        grid-column: 2;
        padding: 5px;
        border: 0;
        text-align: left !important;
        background-color: rgba(0,0,0,0) !important;
    }

    .woocommerce table.cart .product-thumbnail,
    .woocommerce-page #content table.cart .product-thumbnail,
    .woocommerce-page table.cart .product-thumbnail {
        display: block;
        padding: 0 20px 0 0;
        grid-column: 1;
        grid-row: 2 / 10;
    }

    .woocommerce table.shop_table_responsive tr.woocommerce-cart-form__cart-item .product-remove {
        grid-column: 1;
        grid-row: 1
    }

    .woocommerce-cart table.cart img {
        width: 300px;
    }
    .woocommerce table.shop_table.woocommerce-cart-form__contents td div.quantity {
        justify-content: flex-start !important;
    }
}

[Renaldo]

Hey there

That works well, just needs a small tweak here and there please see screenshots.https://postimg.cc/gallery/g1rxnr50/

I think it just needs to be boxed and displayed more like a preview. As all the data is spread out and not really in place or boxed. But that is really close.

[David]

This really is custom development and out of our scope – but i have created a different method here – should get closer to the example:

https://generatepress.com/forums/topic/custom-css-3/page/2/#post-944031

[Renaldo]

Thanks for your help guys! I do appreciate it.

[David]

Glad to be of help

[Author]

Posts