This table illustrates the alignment options for how adjacent text is placed against the image. I have used an image here that has a colored background, so you can clearly see the relationship of the text and the image. You can see that this alignment is talking about the location of text that is on the same line as the image. In all the examples, the code and the text are the same. The only thing that is changing is the alignment selected through the drop-down choices in Dreamweaver.
| Alignment option | Sample |
| Browser Default |
Come see the pelican display. |
| Baseline |
Come see the pelican display. |
| Top |
Come see the pelican display. |
| Bottom |
Come see the pelican display. |
| Text top |
Come see the pelican display. |
| Absolute middle |
Come see the pelican display. |
| Absolute bottom |
Come see the pelican display. |
| Middle |
Come see the pelican display. |
| Left |
Come see the pelican display. |
| Right |
Come see the pelican display. |
As the amount of text increases, you can see that this alignment starts losing its "usefulness". I have used only a few examples here. You can see why web page developers, if they have paragraphs and text, have (mostly) abandoned these options and gone with using cells and a table structure.
|
| Top |
The latest display open to the public highlights the pelican. Feedings occur at 10 am, 1 pm, and 4 pm, and are quite popular with younger children. A volunteer is there during feedings, to help answer questions. |
| Bottom |
The latest display open to the public highlights the pelican. Feedings occur at 10 am, 1 pm, and 4 pm, and are quite popular with younger children. A volunteer is there during feedings, to help answer questions. |
| Absolute middle |
The latest display open to the public highlights the pelican. Feedings occur at 10 am, 1 pm, and 4 pm, and are quite popular with younger children. A volunteer is there during feedings, to help answer questions. |
Close this window to go back to the main lesson.