Support Forum

Please note that this forum is only available to you in read only mode. In order to contribute to this conversation you will need to renew your subscription.

How to center text in a zen tools grid module

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

Hello Again I can not find the setting for aligning the title and text in a Zen Tools Grid module. Please advise. The page is here:

www.crossroadsspringsafrica.org/index.php/support/sponsor-a-student

Thank you.
Elizabeth
  • Elizabeth Wallace's Avatar
  • Elizabeth Wallace
  • 12 Month basic
  • 404 posts
  • Karma: 0
The administrator has disabled public write access.
HI Elizabeth,

Do you mean centre text horizontally or vertically?

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
horizontally thanks
  • Elizabeth Wallace's Avatar
  • Elizabeth Wallace
  • 12 Month basic
  • 404 posts
  • Karma: 0
The administrator has disabled public write access.
Zentools or Zentools2?

Here's 2.

ScreenShot2018-02-10at2.05.06PM.png
  • blueshift's Avatar
  • blueshift
  • 6 Month Developer
  • 2579 posts
  • 78 Thanks
  • Karma: 26
The administrator has disabled public write access.
When using version 1, I add a module class suffix (Advanced Settings tab) then use custom.css. For example, if you put 'my-module-class-suffix' in that field, the following covers two classes of head and the text.
.my-mod-class-suffix h2,
.my-mod-class-suffix h3,
.my-mod-class-suffix p {
  text-align:center;
}

I notice on a T3 site, I seem to have needed an extra selector
.my-mod-class-suffix .zentitle h3 {
  ...
}
  • blueshift's Avatar
  • blueshift
  • 6 Month Developer
  • 2579 posts
  • 78 Thanks
  • Karma: 26
Last Edit: 6 years 2 months ago by blueshift.
The administrator has disabled public write access.
so I tried:
.centertitle h2,
.centertitle h3,
.centertitle h4,
.centertitle p {
text-align: center;
}

.centertitle .zentitle h2,
.centertitle .zentitle h3,
.centertitle .zentitle h4 {
text-align: center;
}

with centertitle in the module class suffix field in the zen module (do I have to put a space before centertitle?)
  • Elizabeth Wallace's Avatar
  • Elizabeth Wallace
  • 12 Month basic
  • 404 posts
  • Karma: 0
The administrator has disabled public write access.
This is ZT1 and T3? T3 usually needs a space, but not Zen Grid Framework.

Sometimes, though, I need to add the zentools ID , which in your case is #zentools524

So maybe
#zentools524 .zentools .zentitle,
#zentools524 .zentext { }
  • blueshift's Avatar
  • blueshift
  • 6 Month Developer
  • 2579 posts
  • 78 Thanks
  • Karma: 26
The administrator has disabled public write access.
in the css style editor, i get the attached

ScreenShot2018-02-10at2.55.36PM.png
  • blueshift's Avatar
  • blueshift
  • 6 Month Developer
  • 2579 posts
  • 78 Thanks
  • Karma: 26
The administrator has disabled public write access.
Hi Elizabeth,

Do you have the title center option set in the module?
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
As in my first photo? (Would only apply to Zentools2)

ScreenShot2018-02-10at2.05.06PM.png
  • blueshift's Avatar
  • blueshift
  • 6 Month Developer
  • 2579 posts
  • 78 Thanks
  • Karma: 26
The administrator has disabled public write access.
Css will apply to any class that matches and has the right level of specificity

center option will work the for title
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
looks like it is centered here. maybe my css worked and my browser is just slow again..
  • Elizabeth Wallace's Avatar
  • Elizabeth Wallace
  • 12 Month basic
  • 404 posts
  • Karma: 0
The administrator has disabled public write access.
I can see the text of the top right module is centered via inline styling

however, for me, the zentools content is not centred

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
2018-02-10_21h12_22.png


This is what I see
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
I guess my css didn't work will try again. Thank you.
  • Elizabeth Wallace's Avatar
  • Elizabeth Wallace
  • 12 Month basic
  • 404 posts
  • Karma: 0
The administrator has disabled public write access.
or as blueshift said

#zentools524 .zentools .zentitle,
#zentools524 .zentext { text-align:center}

should do the trick

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
Thank you for your help. Elizabeth
  • Elizabeth Wallace's Avatar
  • Elizabeth Wallace
  • 12 Month basic
  • 404 posts
  • Karma: 0
The administrator has disabled public write access.
Looks good - and all for a good cause!
  • blueshift's Avatar
  • blueshift
  • 6 Month Developer
  • 2579 posts
  • 78 Thanks
  • Karma: 26
The administrator has disabled public write access.
Excellent cause - thanks for the update
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
Thanks Blueshift

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

Happy Campers