Page 1 of 1

Increase size of display box in feature product grid??

Posted: Thu Aug 04, 2016 6:37 am
by Chris Hadden
I find that the longer titles on products are causing issues with the way the products are rendered in the category and feature product display grids. If the title of the product contains 4 lines of text, then the price is not showing, it is pushed down, now hidden under the "add to cart" button.

Is there a way to increase the length of the box the product is displayed in?

example issue
resize.jpg

Re: Increase size of display box in feature product grid??

Posted: Thu Aug 04, 2016 9:56 pm
by nadeem
You can increase the height of the item container. To overwrite the height of the container, add the following style to your theme's custom.css file:

Code: Select all

.itemContainer {
    height: 320px !important; /* update the height value to the best fit */
}

Re: Increase size of display box in feature product grid??

Posted: Sat Jan 28, 2017 10:24 am
by Chris Hadden
Thank you for the reply. Taken me awhile to come back to this. First, I do not have a custom.css file. I am using the "computer" theme. Can a custom file be created if it is a non responsive theme?

I did look at the current .css style sheet and I tried changing the height of the .itemContainer to see if that would work. The results were that the container itself, the bordered area did lengthen. That did not solve the issue though as the text, price and add to cart button remained in the same position even though the container itself was larger. I am not a code guy I know nothing of this so any answer to me should be super simplified. I can cut and paste and change files but I do not have an understanding of the mechanics of how the code is working. Any help appreciated.

Thanks
Chris

Re: Increase size of display box in feature product grid??

Posted: Sat Jan 28, 2017 3:09 pm
by Chris Hadden
I have discovered this issue is specific to Firefox. Items display properly on chrome and Edge. Is this a bug? Is there a fix for it. Here is typical category display:

Image