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
- 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.
- By putting all the text in a borderless table cell with a separate
content-less cell of defined width overlaying the image.
- 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.