Product Layout out of order because of wrapping pr

In just about every page in my test Hika shop the product grid is uneven because in some products the product name only needs one line while in other product the name takes 2 lines. This in turn makes the product box taller and it messes up the floats for the container divs on the product page.

In CSS I can fix this easily by either giving the title area a set height or giving the entire box a taller height, but before I go ahead and do that, it seems to me that something like this should have been considered in the design.

I see when I create a menu or a view in Hika shop that there is a section where I can set the thumbnail height and width as well as the <div> height. However, while the thumbnail works rather well, the div height simply does not work.

Here is an example of what I mean: seogarden.com/pear/index.php?option=com_...t=listing&Itemid=135
If you go to the page above and scroll you'll see some rows of products having 3 products (as I set them) and others having only 1. In all cases it's due to the title being too long.

Also, I realize that in my example that is a module that has this problem but elsewhere I found it for regular category views as well.

Thank you for your help.

Hi,

The option "pane height" is for the views "listing_fade", "listing_img_pane", "listing_slider_horizontal", "listing_slider_vertical" and "carousel".
You have to set a min height in CSS for your case.

Thank you. I found an existing min-height already, but it is set at 30px or so. I wanted to make sure I wasn't overriding some existing setting. I'll go ahead and set it there. Thank you very much.

We are having the same issue as stated above:

"In just about every page in my test Hika shop the product grid is uneven because in some products the product name only needs one line while in other product the name takes 2 lines. This in turn makes the product box taller and it messes up the floats for the container divs on the product page."

Unfortunately I am not a coder, could you be more specific on how to fix the issue. I have attached a link to one of my product pages with the issue. thanks vaporandco.com/categorylistings/category/20-tips-and-cartridges

Perfect....worked just like you said. Thanks.

hi again. I had to change the back end general display to use bootstrap design in order to accommodate the way the products show up on tablets - portrait view (the were not wrapping correctly). Once i did this it corrected that issue however now on my main view the code that i put in to wrap the text is not working correctly. I have two attachments, one the way it looks without bootstrap enabled and then one with. The code i am using that did work is:

.hikashop_products_listing .hikashop_subcontainer {
min-height: 320px;
}

www.rustlingpalmsstudio.com/pen-sizes/midsize-pens , go to page 2. Thanks.

Hi,

It seems that you are using the list display type, thanks to try with the div one in the menu/module parameters.

You template is overriding our css properties, we set a width in percentage for this kind of listings, but on your page, it's missing.