
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.
DIPLOMA
This is to confirm that
Mr John Philip Doe
born on July 27, 1936
has participated in the following two training courses
drive maintenance
for the
… and …
system programming
for the Mitsubishi type
AnS series of industrial systems
for equipment as delivered and configured by
Elpartner Engineering
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
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.