A large image

                          This page demonstrates the presentation of text with a large background image. The background image has been deliberately chosen to be large and strongly coloured, it consists of the brightly coloured area to the left with the rest of the image white which, of course provides a suitable background for text, however unless the text can be persuaded to start suitably far across the screen, the background image interferes with the visibility of the text.

                          There are three techniques by which this problem can be avoided

                          1. Enclosing the text in multiply nested <ul> ... </ul> tags. Since list bodies are indented this could achieve the desired effect, however this is not what lists are intended for and the amount of indentation is browser dependent.
                          2. By putting all the text in a borderless table cell with a separate content-less cell of defined width overlaying the image.
                          3. By using a left-aligned image of suitable width and height placed over the decorative left margin. The image can well consist of a transparent GIF with a single pixel.

                          The first technique has been used for this page. It required no fewer than 12 levels of <ul> to achieve the desired effect.

                          The first few lines of the HTML look like this 

                          <body background=patt2b.gif>
<ul><ul><ul><ul><ul><ul>
<ul><ul><ul><ul><ul><ul>
<h1 align=center>A large image</h1>
                          A matching set of </ul> tags appears at the end of the document.

                          Note that the Hensa HTML validation service did not like the use of multiple <ul> tags in this fashion although this may be a validation srvice bug rather than an HTML 3.2 non-conformance.