This is a legacy document, and retained on the site in order to avoid link rot. The content is likely no longer (a) accurate, (b) representative of the views and philosophies of current site management, or (c) up to date.

Application of <DIV> to create a "layer"

Example layout of a "layered" diploma

The purpose of this example page is to illustrate how a CSS "layer" can be created using the HTML 4 version of the DIV element.

For any one who may be interested in how this can be suggested using CSS rules, the relevant CSS file can be found at…

<URI: /css/diploma.css >

Open this document in your texteditor to find the actual markup, and download the stylesheet to find out how it is done.

A few of the "old-timers" traditional typesetting "tricks" can also be found in this document. The most obvious one is to use an extra level of horizontal white space inside any sequence of "all cap" text, to create a better balance in the word picture displayed by capital letters. (this is supported by IE4.0x but not by NS4.0x)

All relevant parts of this example layer has been sized using the relative measurement 'em' (meaning that it's based on the font size you have configured in your browser) so it may be an interesting exercise to change your own configured font size to watch the diploma resize itself accordingly.

The original design for the example layer presented on this page, was done with a pen, a piece of paper and a standard ruler. Style rules was written directly based on that paper design without any consideration on how it would eventually render in any particular browser. I leave it up to you as the user to decide how you want it rendered in your particular browsing situation.


This is to confirm that

Mr John Philip Doe
born on July 27, 1936

has participated in the following two training courses

DC drive maintenance

for the BBC type AAZD and ZAD series of DC motor drives

… and …

PLC system programming

for the Mitsubishi type MELSEC AnS series of industrial PLC systems

for equipment as delivered and configured by
Elpartner Engineering AB Sweden
for use at Timet UK Ltd Swansea, Wales

The training period spanned over the full five days of week 50-1997, and included both theoretical and practical studies on the specified topics

On December 22, 1997 for

alt="- LogoType -" src/images/elp-logo.gif"

Elpartner Engineering AB
Jan Roland Eriksson

The purpose of this example page is to illustrate how a CSS "layer" can be created using the HTML 4 version of the DIV element.

Jan Roland Eriksson