Return to previous page

How to left-align the output of products in a list

This topic has 10 replies, 3 voices, and was last updated 1 months, 2 weeks ago ago by Luca Rossi

Goostaf

Participant

January 30, 2025 at 09:41

Hello, we have all products are displayed differently, not very convenient, is there any way to align them? For example, on the left edge?

Please, contact administrator
for this information.

Files is visible for topic creator and
support staff only.

#432778 Copied Theme version: 9.4.5

9 Answers

Tony Rodriguez

Support staff

January 30, 2025 at 11:48

Hello, @Goostaf,

Thank you for contacting us and for using XStore.

1/ Kindly ensure that your website is running the latest versions of the XStore theme (9.4.7) and the XStore Core plugin (5.4.7). You can refer to the following links for update history and detailed instructions on updating:

– https://www.8theme.com/downloads/
-https://xstore.8theme.com/update-history/
– https://www.8theme.com/documentation/xstore/theme-installation/theme-update/

Afterward, please clear all caches and check again.

2/ Could you kindly provide details regarding the device you are experiencing the issue on, along with its screen size in pixels? This information will allow us to replicate the issue on the same device and assist you more effectively.

We appreciate your cooperation and look forward to resolving this matter for you.

Best regards,
8Theme’s Team

#432793 Copied

Goostaf

Participant

February 12, 2025 at 21:19

Everything has been updated, the problem remains

Please contact administrator
for this information.

#434181 Copied

Tony Rodriguez

Support staff

February 13, 2025 at 04:59

Hello, @Goostaf,

Thank you for your response.

Kindly provide your WordPress admin access in the private content area so that we can thoroughly review your settings and assist you more effectively.

Should you have any questions, please feel free to let us know.

Best regards,
8Theme Team

Please contact administrator
for this information.

#434188 Copied

Goostaf

Participant

February 15, 2025 at 11:59

Hello, discount, we have deployed the site on a test domain, so that on the current project not to work, please prescribe us the edits you make so that I can transfer them to the current site, thank you

Please contact administrator
for this information.

#434397 Copied

Luca Rossi

Support staff

February 17, 2025 at 09:40

Dear @Goostaf,

Thank you for reaching out to us.

We have attempted to reproduce the issue on our end but were unable to do so.

Could you kindly disable all customizations by switching to the XStore parent theme or removing any custom CSS codes, and then check again? This will help us better understand the situation and provide further assistance.

We appreciate your cooperation and look forward to your response.

Best regards,
8Theme Team

#434530 Copied

Goostaf

Participant

February 17, 2025 at 09:49

Recorded a video, you can see that the cards are all out of alignment on the left edge and the layout of each one jumps around

Please contact administrator
for this information.

#434532 Copied

Luca Rossi

Support staff

February 18, 2025 at 09:42

Hi @Goostaf,

We did see the issue in your website.

Did you try with our solutions above: https://www.8theme.com/topic/how-to-left-align-the-output-of-products-in-a-list/#post-434530?

Let us know how it goes!

#434643 Copied

Goostaf

Participant

February 21, 2025 at 11:50

I found a piece of code in the css:

.products-list .content-product .product-image-wrapper img {
width: auto;
}

I remove it, everything is aligned, but it still displays crookedly and the buttons to cart jump when hovering..I can’t figure it out without you:( I want it to be beautiful, like you have in your demo.

Files is visible for topic creator and
support staff only.

#434967 Copied
Luca Rossi

Support staff

February 22, 2025 at 11:17
Hi @Goostaf,

Please also add this custom CSS codes:

.products-list .content-product .image-swap, .products-list .content-product .product-content-image{ text-align: left; } body .products-list .product-image-wrapper { float: left !important; display: block !important; } body .products-list .content-product { display: flex; flex-direction: row; }

Hope it helps!
#435049 Copied
Viewing 10 results - 1 through 10 (of 10 total)