css code to show full product title on thumbs

alinajenon

Hi! Would anyone be able to assist me with correct css code to show the full product title of product thumbnails?

Example of product page where titles are being cut off in most browsers/mobile:

http://www.livingorganique.com/spa/chromotherapy/

Thank you!

alinajenon

I have access to Theme Editor, here are screenshots of the files.

Pit_La_Quille

Hello there !

I think you will need to work with the 'product.rain' snippets and the 'style-min.css' assets !

Do you want it to be displayed when the mouse is over like your exemple ? if so, you'll need to work with the 'hover' selector. This could help you : https://www.w3schools.com/csSref/sel_hover.asp

you can also check the others selectors, you may need them to.

Have a nice day !

Joey

Hi @alinajenon

The text is hidden by the CSS class .products .product .info .title

The overflow is set to hidden: overflow: hidden;

But by changing it and showing the hidden text it will be flowing over the price text. You will need to modify the CSS of the height as well to make it all work properly.

The issue:

By tinkering with the CSS you can make it work tho! Or adjust the product titles.