Text and Image Alignment within Paragraphs

 

Horizontal Paragraph Alignment

The following instructions can be used with both images and text within paragraphs.

  1. Highlight the paragraph you want to edit.

  2. From the Format menu, select Paragraph.

To horizontally align your paragraph using standard HTML tags:

  1. In the Format Paragraph dialog, navigate to [Paragraph Tag]

  2. Using the Paragraph Alignment drop-down list, select the the horizontal alignment of the paragraph with respect to the document margins. The different options are defined below.

Left

Selecting this option places your paragraph against the left document margin.

Center

Selecting this option centers your paragraph between the two document margins.

Right

Selecting this option places your paragraph against the right document margin.

Justified

Selecting this option justifies your paragraph between the two document margin.

 

  1. Click OK to apply the changes.

To horizontally align your paragraph using inline styles:

  1. In the Format Paragraph dialog, navigate to [Inline Styles][Paragraph].

  2. Using the Text Alignment button box, select the alignment of the paragraph . This aligns your paragraph using inline style definitions. The different options are defined below.

     Clicking this button places your text against the left paragraph margin.

     Clicking this button centers your text between the two paragraph margins.

     Clicking this button places your text against the right paragraph margin.

     Clicking this button justifies your text between the two paragraph margins.

  1. Click OK to apply the changes.

Vertical Text Alignment

Vertically aligning text using inline styles provides greater flexibility than using standard HTML Tags.

To vertically align your text using inline styles:

  1. Highlight the text you want to edit.

  2. From the Format menu, select Paragraph.

  3. In the Format Paragraph dialog, navigate to [Inline Styles][Font].

  4. In the Vert Align drop-down list select the alignment of the paragraph. This aligns your paragraph using inline style definitions. The different options are defined below.

baseline

Selecting this option aligns the baseline/bottom of the text with the baseline of the line.

sub

Selecting this option inserts the text as a subscript (a subscript is a character appearing immediately below and to the right or left of another character).

super

Selecting this option inserts the text as a superscript (a superscript is a character appearing immediately above and to the right or left of another character).

top

Selecting this option aligns the top of the font with the tallest element on the line.

text-top

Selecting this option aligns the top of the element with the top of the parent element's font

bottom

Selecting this option aligns the top of the font with the lowest element on the line

text-bottom

Selecting this option aligns the bottom of the element with the bottom of the parent element's font

To vertically align your text using standard HTML tags:

With this method two vertical alignment options are available: subscript and superscript. Selecting the subscript option inserts the text as a subscript (a subscript is a character appearing immediately below and to the right or left of another character). Ticking the superscript option inserts the text as a superscript (a superscript is a character appearing immediately above and to the right or left of another character).

  1. Highlight the text you want to edit.

  2. On the Format menu, select Font. Alternatively, just press F2.

  3. In the Format Font dialog, navigate to [Font Tags]

  4. In the Tag Effects window, tick either the Superscript or Subscript check box.

  5. Click OK to save the changes.

Image Alignment: Aligning Images with Text

Images also have their own horizontal and vertical alignment properties. However, every browser treats these properties slightly differently. The different attributes are defined below. The problem is that while most of these attributes do the same thing, how they look differs from browser to browser. In Netscape and MS Internet Explorer there are actually only 3 vertical different alignments you can choose.

Left

Selecting this option causes the image to float to the current left with content flowing around it.

Right

Selecting this option causes the image to float to the current right margin with content flowing around it.

Top, Texttop

Selecting this option aligns the top of the image with the top of the current text line.

Middle

The effect of this option depends on the web browser. For example, with Netscape this option aligns the baseline/bottom of the image with the baseline of the current text line. With Internet Explorer 3 this option aligns the center of the image with the absolute middle of the text.

Absmiddle

Selecting this option aligns the center of the image with the absolute middle of the text. The absolute middle of the text is the midpoint between the absolute top and bottom (i.e., the top and the bottom of the envelope around the text) of the text.

Baseline, Bottom

Selecting this option aligns the baseline/bottom of the image with the baseline of the current text line. This is the default alignment.

Absbottom

Selecting this option aligns the bottom of the image with the absolute bottom of the text. The bottom of the envelope surrounding the text is aligned with the bottom of the image.

For more detailed information regarding image alignment, refer to the discussion about changing the way text flows within paragraphs. Alternatively, see the instructions on inserting images for detailed information about the different image properties.

NOTES

  • Occasionally you may wish to change a paragraph style that you have already defined for a set of tags. Instead of selecting all the blocks of text within the tags that you wish to format, just select the entire opening tag. For example, if your paragraph is within H1 tags then you would select everything within:

<H1 STYLE=" ......">

Then just go to the Format menu and select Paragraph as usual.

  • If you select multiple paragraph tags for editing, only those attributes all paragraphs have in common will be displayed in the Format Paragraph dialog.

  • A full discussion of the relative advantages and disadvantages of using HTML or inline styles for formatting is provided here.