Getting Spaced Out

Getting Spaced Out

HTML’s page layout features are limited for older browsers–tables provide one of the few ways you can force text or graphics to appear in particular positions. Another addition to your armory of layout tools is judicious use of spacer graphics.

A spacer graphic is a one pixel by one pixel transparent GIF (easily created in almost any bitmap graphics application). You can resize this spacer graphic using the HEIGHT and WIDTH properties of the tag to force other page elements adjacent to it to appear in the position you want. What’s more, it hardly adds any overhead to download times.

For example, this code forces the text to start 50 pixels from the left margin of the page:

 Spacer GIF Example

This text starts 50 pixels from the left margin.


Share the Post: