Docs

[rotipom]

Hi there,
I’m using Woocommerce category pages, a native feature with one of my x template pages and the page is all screwy in mobile mode, with the description text going all the way up to the banner above. This is a problem with my other shop pages too where the breadcrumbs/arrows are doing the same thing. (see screenshot attached)

http://www.amytwon.com/product-category/journey-prints-kits/

What can I do to fix this? Thanks!
A

[Rahul]

Hey There,

Unfortunately, we could not see any attachments here with this thread. Kindly send us a proper Screenshot having max file size 512KB.

Thanks!

[rotipom]

Reattaching screenshot.

[rotipom]

Just reattached above, can you see it?

[Thai]

Hi There,

To fix this issue, please add the following CSS under Customizer > Custom > Global CSS:

@media (max-width: 767px){
    .tax-product_cat #x-section-1 .x-column.x-sm.x-1-1 .x-img {
        margin-bottom: -40px !important;
    }
}

Hope it helps 🙂

[rotipom]

Thai, this is perfect thank you!!!!
However the single product page still has the breadcrumbs/arrows floating too high. How can I change that? (see attached screenshot)

Thanks again,
A

[Christopher]

Hi there,

Update previous code to :

@media (max-width: 767px){
    .tax-product_cat #x-section-1 .x-column.x-sm.x-1-1 .x-img ,.single-product #x-section-1 .x-column.x-sm.x-1-1 .x-img {
    margin-bottom: -40px !important;
}
}

Hope it helps.

[Author]

Posts