Examples of IMG Alignment

Go to: top | middle | bottom | left | right | texttop | absmiddle | baseline | absbottom | hypertext anchor |

ALIGN="top"

<p> <IMG SRC="testicon.gif" ALT="[Test image]" 
ALIGN=TOP> Here is some text related to the test image.  
It is not very interesting, but should show how the 
text is wrapped around the image given the ALIGN=TOP 
alignment attribute.
This is rendered:

[Test image] Here is some text related to the test image. It is not very interesting, but should show how the text is wrapped around the image given the ALIGN=TOP alignment attribute.

ALIGN="texttop"

<p> <IMG SRC="testicon.gif" ALT="[Test image]" 
ALIGN=texttop> Here is some text related to the test 
image. It is not very interesting, but should show 
how the text is wrapped around the image given the 
ALIGN=texttop alignment attribute.
This is rendered:

[Test image] Here is some text related to the test image. It is not very interesting, but should show how the text is wrapped around the image given the ALIGN=texttop alignment attribute.

ALIGN="Bottom"

<p> <IMG SRC="testicon.gif" ALT="[Test image]" 
ALIGN=BOTTOM> Here is some text related to the test 
image. It is not very interesting, but should show 
how the text is wrapped around the image given the 
ALIGN=BOTTOM alignment attribute.
This is rendered:

[Test image] Here is some text related to the test image. It is not very interesting, but should show how the text is wrapped around the image given the ALIGN=BOTTOM alignment attribute.

ALIGN="absbottom"

<p> <IMG SRC="testicon.gif" ALT="[Test image]" 
ALIGN=ABSBOTTOM> Here is some text related to the test 
image. It is not very interesting, but should show how 
the text is wrapped around the image given the 
ALIGN=absbottom alignment attribute.
This is rendered:
[Test image] Here is some text related to the test image. It is not very interesting, but should show how the text is wrapped around the image given the ALIGN=absbottom alignment attribute.

ALIGN="middle" 

<p> <IMG SRC="testicon.gif" ALT="[Test image]" 
ALIGN=MIDDLE> Here is some text related to the test 
image. It is not very interesting, but should show 
how the text is wrapped around the image given the 
ALIGN=MIDDLE alignment attribute.
This is rendered:
[Test image] Here is some text related to the test image. It is not very interesting, but should show how the text is wrapped around the image given the ALIGN=MIDDLE alignment attribute.

ALIGN="absmiddle"

<p> <IMG SRC="testicon.gif" ALT="[Test image]" 
ALIGN=ABSMIDDLE> Here is some text related to the test 
image. It is not very interesting, but should show how 
the text is wrapped around the image given the 
ALIGN=absmiddle alignment attribute.
This is rendered:

[Test image] Here is some text related to the test image. It is not very interesting, but should show how the text is wrapped around the image given the ALIGN=absmiddle alignment attribute.

ALIGN="baseline"

<p> <IMG SRC="testicon.gif" ALT="[Test image]" 
ALIGN=BASELINE> Here is some text related to the test 
image.  It is not very interesting, but should show how 
the text is wrapped around the image given the 
ALIGN=baseline alignment attribute.
This is rendered:
[Test image] Here is some text related to the test image. It is not very interesting, but should show how the text is wrapped around the image given the ALIGN=baseline alignment attribute.

ALIGN="left"

<p> <IMG SRC="testicon.gif" ALT="[Test image]" 
ALIGN=LEFT> Here is some text related to the test image. 
<BR> It is not very interesting, but should show how 
the text is wrapped around the image given the 
<BR clear="left"> attribute. Note how the element
<BR clear="left"> clears the flow of text to fall 
after the image.
This is rendered:

[Test image] Here is some text related to the test image.
It is not very interesting, but should show how the text is wrapped around the image given
the ALIGN=left alignment attribute.

ALIGN="right"

<p> <IMG SRC="testicon.gif" ALT="[Test image]" 
ALIGN=RIGHT> Here is some text related to the test image.  
It is not very interesting, but should show how the 
text is wrapped around the image given the ALIGN=right
alignment attribute.
This is rendered:
[Test image] Here is some text related to the test image. It is not very interesting, but should show how the text is wrapped around the image given the ALIGN=right alignment attribute.


Image as Hypertext Anchor

<p> <a href="image_ex.html"> <IMG SRC="testicon.gif" 
ALT="[Test image]" ALIGN=MIDDLE> </a>  This icon 
is also a hypertext link (in this case, just back to
this document).
This is rendered:

[Test image] This icon is also a hypertext link (in this case, just back to this document).