Skip to content | Change text size
 

Cascading style sheets (CSS)

The web templates use cascading stylesheets (CSS) for formatting page elements. However, because Netscape 4 was widely used at Monash, HTML tables are used for page layout. Using tables for layout is now being phased out because of improvements to browsers and the layout techniques that can be achieved using style sheets.

For information on the implementation of stylesheets and cross-browser/platform rendering, see technical implementation.

Use styles to format content elements

The stylesheets provide a list of styles that can be applied to common page elements. Styles should be used to format page elements for display.

Do not use HTML font elements

Do not use the <font> element. If you want to use larger text for a decorative effect, use a style. If the text is a heading, use a heading tag: <h1>, <h2>, etc. Avoid using smaller text sizes than those provided as the default in the stylesheets.

Do not use HTML color attributes

Do not use the color="" attribute. Colours are included in the Monash stylesheets. Additional colour options (subject to branding, usability and accessibility guidelines) can be added to either the centrally-maintained stylesheets or to a local stylesheet.

Local stylesheets should only be used for limited styling

Local stylesheets must be added to faculty and sub-brand templates to apply the approved colours for the site.

Additional styles may be added, but should be limited to simple text styles that display properly across a range of browsers. More complex styles must be added to the centrally maintained stylesheets.

If adding additional text styles, do not use fixed font sizes (points and pixels). Use relative sizes instead (ems and percentages). This must be done because:

  • users must be able to change their browser settings to make the text size readable
  • the "change text size" feature built into the Monash web templates will only work when relative font sizes are used.

Resources