Basic Positioning

Positioning with Align and Valign

You can position the content of a cell vertically by using valign="top", valign="middle" & valign="bottom" in a <td> tag. The default is valign="middle".

The table below shows an image in each of the nine possible positions within a cell. Height & width are used to make the cells larger than the image in this illustration. You can "fine tune" your positioning by adding <br> tags, &nbsp; (no break space) and spacers.

The 9 positions are:

• top left
• top center
• top right
• middle left
• middle center
• middle right
• bottom left
• bottom middle
• bottom center

3x3 Table showing align & valign
	align= "left"	align= "center"	align= "right"
valign="top"
valign="middle"
valign="bottom"

Table Lab

Use align and valign to position an image in a table. Post your table. Show your code.

Our next discussion will be on more precise positioning.

As always, questions and comments are welcome.

Happy tabling,
Gnubee