Hi,
I've created a Zen Tools 'Grid Gallery'
In this Zen Tools 'Grid Gallery' I modified the Gallery Modul / Options / Grid Settings / 'Theme for grid layout' = Boxed
and 'Disable margin between grid items?' = no
Where can I adjust the margins between the gallery preview pictures? Is there a css file? Is there a less file? I just want them to be smaler

Thanks for help - I've tried but I couldn'f find the file where the space between the gallery previe images are adjusted. Here you can have a look at it: www.fraukepetersen.de/joom/index.php/aktuell/testgalerie

Madiwo

Are we talking horizontal or vertical spacing or both?

Cheers
Paul

if its horizonal the css would need to be adjusted

so something along the lines of

#zentools278 .zentools .grid_four,#zentools278 .zentools .grid_four { width: 32.1%; margin-right: 1.8%;}
#zentools278 .zentools .zenlast {margin-right: 0%;}

Reducing the margin while increasing the width - it will involve a bit of trial and error but that was the values I ended up with

you would need to add this to the custom.css file

Cheers
Paul

I was talking about horizontal and vertical spacing - both.

I will try your hints for the horizontal spacing soon and tell the result. Thank you very much for your immediate reply.

Madiwo

Hi

the margin-bottom could be potentially tricky given the animation you've chosen - so I'm not a 100% sure how it will work cross browser

#zentools278 .zentools.overlay li {
margin-bottom: 30px;
}

You need to adjust the margin value as required and add to you custom coding

Cheers
Paul

I should also mention I'm targetting the individual module id so it will only work in this module

Cheers
Paul

Here is the sulution I've worked out with your answers:

Width of horizontal spaces in zentools gallery

preset:
\media\mod_zentools\css\ grid.css

row #28
margin-right: 3.8%;

row #75
.zentools .grid_four,.grid_3
{
width: 30.75%
}


adjusted:

row #28
margin-right: 0.8%;

row #75
.zentools .grid_four,.grid_3
{
width: 32.79%
}

---

Width of vertical spaces
\media\mod_zentools\css\zentools.css

preset:

row #228
.zentools.overlay li {
overflow: hidden;margin-bottom: 30px;
}

row #360
padding-bottom: 20px;



adjusted:

row #228
.zentools.overlay li {
overflow: hidden;margin-bottom: 0px;
}

row #360
padding-bottom: 4px;

---

you can see the result here: www.fraukepetersen.de/joom/index.php/aktuell/testgalerie

Thank you very much - it is really great to get answers to questions which are slowing down the work

cheers Madiwo

I'd suggest adding new styles to the custom.css file as if you update the zentools module these changes will be lost

Cheers
Paul

Thank you for your suggestion. I'v added the code by using the joomla extension 'Custom CSS'
extensions.joomla.org/extensions/style-a-design/templating/14053
and it worked perfectly. THX Madiwo

Right you could have created a file called custom.css in the template css folder and it would be picked up but this way looks just as good

Cheers
Paul