Product align for mobile

[hyobinlee]

Dear supporter,

I’d like to apply different product align for mobile view. Current my mobile site view is really strange.. so many white area. You can check my mobile site with this url.
http://Www.thefepi.com

Here’s what i want to do

1 product on a row. Without no space both sides. Like full with view. You can check my attachment

Thanks a lot!!

Attachments:

You must be logged in to view attached files.

[Rui Guerreiro – SUPPORT]

Hi,

Add the code below to your custom css option.

@media only screen and (max-width: 767px){
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product, .woocommerce-page[class*=columns-] ul.products li.product, .woocommerce[class*=columns-] ul.products li.product {
    width: 100%!important;
}
.container {
    padding: 0 0px;
}
}

-Rui

[hyobinlee]

Dear supporter,

Thank you for the support. I added your code on my css custom
1 product on a row is perfectly working,
buy the way still has the space on the both sides
Can you check my attachement?

1. can we remove the space on both side?
2. can we align ‘product name’ on left align? like my web view?

Thanks in advance

Attachments:

You must be logged in to view attached files.

[David Martin – Support]

Please add this to Theme Options => Custom CSS:

@media only screen and (max-width: 767px) {
.woocommerce ul.products li.product h3, 
.woocommerce-page ul.products li.product h3 {
text-align: left;
}
.woocommerce[class*=columns-] ul.products li.product {
    margin: 0 auto!important;
}
}

[hyobinlee]

Dear David,

Thank you, it’s working well!

But, after that code added, on my single product page is also absolutely left align like my attachement.
So, can I know how can I apply to center align for several resource

1. page title
2. simple page description (It’s not a main description)
3. Color / size / etc. which are attribute-> variation
4. Quantity
5. Add to shopping bag / wish list

Quite a lot ;;

THANKS ALWAYS

Attachments:

You must be logged in to view attached files.

[hyobinlee]

I solve the problem
Thank you so much!!

[Rui Guerreiro – SUPPORT]

No problem. Glad it’s sorted.

-Rui

[danielddiego]

Hi ther, love your fantastic.

I have try to do this and other options i have seen in other topics, but i couldn’t make it works.

I juat need all products for responsive appears in a row, bur in homepage. Right now, you can see 2 products.

Is that possible?

Thanks a lot.

[Rui Guerreiro – SUPPORT]

Hi @danielddiego,

Can you provide us your site url to have a look? Also some admin credentials in a private reply can help to identify the issue.

-Rui

[guentherportfolio]

This reply has been marked as private.

[David Martin – Support]

Are you sure that is not caused by your modifications? What is the page URL?

[guentherportfolio]

This reply has been marked as private.

[David Martin – Support]

This is causing it:

Your using a CSS cache so I cannot see where this is originating from. Got a login for me?

[guentherportfolio]

This reply has been marked as private.

[David Martin – Support]

Please add this to Theme Options => Custom CSS:

@media (max-width: 767px){
body {
    padding-right: 0;
    padding-left: 0;
}
}