NSP Active Hover Box too Large

Hello, following this article I've enlarged the width of my template:
https://www.gavick.com/documentation/jo ... n-template

Now the frontpage NSP module, when an element is hovered, as a box that's too large in width.

I tried adjusting the width of this element, but since I have a limited amount of item to show, it looks odd is the disposition changes. I would like to keep the 4 column of 3 elements; changing the folowing CSS changed it to 5 columns to fill up gaps:

Code: Select all

gkNspPM-Portfolio2 .gkImagesWrapper > a.active {
opacity: 1;
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
width: 225px; // (added, won't work. Gives 5 columns instead of 4)
}


I just want the hover box to be the same dimension as the item image showed.

Here is the link: http://www.quebecguitare.ca/
(it's the "My hot work" section module)

Regards

Hello,

In this case you have to increase the size of thumbnails generated by the module or add in the template settings -> advanced settings -> custom CSS code option the following code:

Code: Select all

.gkNspPM-Portfolio2 .gkImagesWrapper > a img {
width: 100%;
}

Thank you Dziudek it worked!
http://www.quebecguitare.ca/

Regards