Product Alignment Issue

Hi!
It’s me again. I’ve been trying to dig for information to resolve this issue but don’t seem to be able to find it, or maybe I’m looking in wrong places. The product listings aren’t aligned properly if the amount of text for the product title is different. Is there a way to resolve this? Please take a look at the attached screenshot.

Hey there

Please always include link to your problem, we always need url of the page to check the problem

It’s currently in local host and I have no link to share for this.

Hello,

I hope you are doing well today.

This is a guess for the solution since we cannot inspect the page but you can try to use the following CSS code to change the font size by going to Appearance > Customize > Additional CSS and pasting it there.


.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 15px;
}

Best Regards,
Support

Hi!

The code didn’t help. The buttons are still not aligned with each other as in the attached screen shot. Is there a way or which files and which line of code I can copy and paste for you to check?

Hello,

We would need to have access to your site in order to correctly assess the issue but you can try to change the CSS by inspecting the element and changing the CSS if you are knowledgeable with CSS. This guide will show you how to use the inspect element option:

Best Regards,
Support

Hi!

Unfortunately, I’m not too knowledgeable with CSS. I did find an article somewhere else that is exactly what I’m trying to do. But I’m unsure if I can incorporate it onto your theme as it does state if the theme I’m using uses different class names or IDs, it might not work. Can you help verify this or change their code a little to adjust for your theme? Thanks a million!

Link: https://www.skyverge.com/blog/woocommerce-align-add-to-cart-buttons/

Hello

Come back to us once again you publish your website online, without seeing it we are useless

I’ve finally have the site setup online for you to check. What details do you need and where can I send them. I don’t think I’ll be providing passwords here on the forum. The URL is here.

https://powertrendprototype.000webhostapp.com

Hey there

We just need to see the website, please disable coming soon page

Done

Hello,

You can use the following CSS code to change the font size by going to Appearance > Customize > Additional CSS and pasting it there.


.tyche-product h3 {
    font-size: 14px;
}

Now, this issue is mainly caused be the amount of text in the product title so the more words that are in the title the more space is needed, so you must be mindful of this fact.

Best Regards,
Support

Hi! It happens on the other pages too. Was the code you gave supposed to be for all tyche.product listings?

If there is a possibility of auto aligning the buttons then that would be much more efficient for users. Your resolution is only a superficial fix as it is quite hard to reduce title names to all products we place on the site. When that’s the case, I’ll have to battle between font size or title length. Doesn’t really make sense for the person setting up the site.

Good morning

Please try this code:

.woocommerce ul.products li.product .woocommerce-loop-product__title {
height: 70px;
}

Hi!

This didn’t work. The buttons still aren’t aligned. If you take a look at the first page slider for the products and click the right arrow to see the next page of products, some still have 2 lines and move the buttons 1 line lower.

Hello clintonwong

Sorry but the code is not applied, it not inserted or inserted with mistake, please check and share screenshot of the code on the place

Please find the attached screenshot.

Hello,

Are you able to edit the height value to see if that helps you at all?

Best Regards,
Support

I changed the height px from 70 to 150 and it doesn’t seem to change anything.