CSS, Cascading Style Sheet, is one method of formatting text, articles and or pages. As the U3A web site develops so does the CSS file. Because it has grown randomly there is no order to naming or within the file. Cascading means the last positioned item over rides any preceding.

Updated April 2016.

Joomla relies on a template to format each page and each page can have a different template. U3A Tauranga consider a consistent design should be on every page with a consistent colour scheme to help link the web site together. Only one template is in use as at April 2016. TThhis template is 'Basetemplate-joomla3'

The following is some of the CSS which can be used as a class within <div>, <p> or <span> tags.

This is a normal type sample for comparison. ('roboto', a google font, as at April 2016)

.clearboth is used with a non breaking space in a <p class = "clearboth">&nbsp;</p> to stop following text or images wrapping out of sequence on wide displays.

.nextmeeting aligns text centre, background color #DDDDF7, border 2px blue.
This is a useful format to use as it keeps a consistant look.

.centreAll aligns text centre.

.daysofweek > li > a; This is like a menu table >li relates to the line, >a relates to the link

.underlineText does what it says, limited use as an underline indicates a clickable link.

.bluebgrd puts the colour as a background, color #EEEEF7.

.bgrdbeige puts a coloured background, color #CCFFCC.

.mauvebgrd puts a mauve background, color #F8E8FF with 5px padding and a 2px border, color #E9A4F4.

.set_red makes text within the class red.

.lgtextmauvebgrd Same as mauvebgrd but text is centred. Could have a line to make text a larger size.

.greenborder_bgrd green background, color #CCFFA2 with a 2px border, color #80FF00.

.linkcol1 and .linkcol2 sets each width to 50%, one float left, the other float right, used on the links page

The CSS file will constantly change as the web group meetings discuss and suggest ways to make the web site look better.

Note CSS needs American spelling, center and color so our spelling can be used as class names.

An example of how CSS affects an article.

The Next Meeting article is within a <div class = "nextmeeting"> tag.

The Next Meeting article when viiewed in the edit screen appears left justified.

The Next Meeting article when viiewed in the front end is now centre justified..