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.