Sorry for the crazy long title. I got some code from you in a previous ticket that helped me to reduce the width of the white space between our zengrid2 modules. However, it also moved the content of the entire site a few pixels to the left and threw it out of alignment. This is my modules in the grid5 position.

Basically the idea was to change from this:
.zentools [grid-col] {padding-left: 3%; padding-right: 3%;}
to this:
.zentools [grid-col] {padding-left: 1%; padding-right: 1%;}

It worked really well except that it shifted everything. So, I tried to put the left padding back to 3% and that did align things on the left side again but then it pushed the zengrid2 module too close to the banner images that I have in the grid6 position.

So, I have removed the changes for now and what you see in the attached image is what it looked like at 1% for both settings.

The two things I hope to accomplish:

1) Align the banners to the right so that they will line up with the right column of the navigation bar.

2) Reduce the padding between the items in my ZenTools2 module without throwing the alignment of the grids off from the left edge of the navigation bar.

Any other fun ideas? My attachment should show where the two alignment points are that I am trying to keep.

I would also love to be able to align the banner in the header position to the right to line up with the edge of the navigation bar as well.

Hi Sean,

Can you add the link for the site?

BTW, on the right side alignment it works perfectly if I use a ZenTools2 module so the alignment issue there is something to do with the banners code.

I just discovered that the issue with the alignment on the right side only happens when the browser is sized wider than the width of the template. Somehow the navigation menu grows wider than the maxiumum template width.

So, this may just be something I have to live with?

Also, I can live with it if I cannot reduce the white space in the ZenTools2 grid without making the alignment go bad.

Sorry Sean you've lost me

I thought I suggested adding the module id to

.zentools [grid-col] {padding-left: 1%; padding-right: 1%;}

Thanks Paul,

That is what I had added (.zentools [grid-col] {padding-left: 1%; padding-right: 1%;} ). However, I had just removed it before putting in this forum post. I just now added it back for you to see what happens. It will start to look like my picture that I attached.

I am starting to think that anything we do to the grid columns margins will effect the alighnment.

Sean

Paul,

Let's not worry about this forum post. I am fine with the wider spacing between the images. When I do that the template lines up just fine.

That said, you can probably add the following:

.zentools [grid-col] {padding-left: 1%; padding-right: 1%;}

and then you will probably see the modules all get moved to the left of the menu navigation bars left edge.

Sean

Hi Sean,

I thought I suggested an alternate style - this one

#zentools-294.zentools [grid-col], #zentools-295.zentools [grid-col], #zentools-296.zentools [grid-col], #zentools-297.zentools [grid-col], #zentools-298.zentools [grid-col] {padding-left: 1%; padding-right: 1%;}

so it doesn't include all modules just the modules with these specific ids

so not all modules are affected

I did try that code as well. It had the same results. But, you are probably right that it is only effecting those modules. But, I believe I am just going to drop this requirement which was to reduce the white space between the images. They look pretty good now. Thanks so much for helping with this!!!

Sean

Hi Sean,

I think that is probably wise as other wise you would need to adjust some column widths using

I think for the header it would be

@media screen and (min-width: 787px) {
.zg-col-8 {width: 68.66666666%;}
}

but it would be complicated as it may have required several styles dealing with various media queries

Cheers
Paul

Good News Paul,

I found a very good solution for this issue of the margins. I changed the module type from Grid to Carousel and then turned off all the carousel settings and the margins all narrowed exactly like I was hoping they would without throwing off the grid. Yay!

samag.cloudaccess.net/

Nice one

Cheers
Paul

www.joomlabamboo.com/index.php?option=com_kunena&view=topic&catid=559&id=115820&Itemid=215

Update needed