Content alignment inside looper list

[Glasseye]

Good day support,

Could you help us align these buttons (which we’ve placed in a row item to keep them grouped) to the bottom of the product container in this looper list item? We’ve tried the regular auto and 100% margins, paddings etc but can’t seem to get the buttons to sit evenly at the bottom. These usual tricks don’t seem to fire/work inside a looper list element.

The description of each item will change so the biggest description in a row will dictate the amount of height a product container has, but we just want the buttons in a row to stay neatly at the bottom regardless.

[tristup]

Hi @Glasseye,

To make the buttons aligned, the content section should be at the same height. You may need to add some custom CSS code or JavaScript to do that. I would suggest you go through the following thread which may help you with this.

How to fix card height issue

Hello - I tried this fix from this post: Level Cards to Same Height But it’s not working for me on my site for some reason. I need help making the cards uniform and make them fade. I cannot figure out how to make it all work.

Woocommerce background color

Thank you for your reply. It solved the problem partially. There is a still issue with the position of prices. We want to have the prices in the same line [Bez názvu] so is there a way how to put a gap between product name and the price? (so the price will be always “the fourth line”) Michael

WooCommerce product image height to be the same and centred please!

Hi @core365, To make the height of all 4 products, make sure that the images are in proper aspect ratio and size. In your case the image of the 4th product is not at the same height, I would suggest you add the image in the same size or add the following JavaScript code into the Theme Options > JS to match the height forcefully while loaded. jQuery(document).ready(function($){ var max=0; jQuery(".memorial-range li.product img").each(function(index, el) { console.lo…

Hope it helps.
Thanks

[Glasseye]

Unfortunately the solutions you gave did not help. However I was able to set the looper list item’s vertical alignment to “stretch” and the button row’s vertical alignment to “end” and it did what was necessary.

[tristup]

Hi @Glasseye,

Glad to know that you are able to find the solution.

Thanks