Text, Style Builder Dialog Box

  • Article

The Text page of the Style Builder dialog box makes it possible for you to define cascading style sheet (CSS) text positioning attributes. You can either apply these attributes directly to HTML elements, or add them to CSS style rules.

To apply text positioning attributes directly to text in HTML elements on your page

  1. Open your HTML document in Design view of the HTML Designer and select the text to format.

  2. Click Style on the Format menu to open the Style Builder dialog box.

  3. Click Text in the left pane of the Style Builder dialog box.

    The Text, Style Builder dialog box appears in the right pane.

When you apply styles to text selected in Design view, CSS style attributes are inserted inline into the HTML markup for your page. Switch to HTML view to review the new style attributes inserted.

To add text attributes to a CSS style rule defined in an external style sheet

  1. Open an existing external style sheet and place the insertion point within the curly braces ({ }) that follow the selector for the desired style.

  2. Click Build Style on the Styles menu to open the Style Builder dialog box.

  3. Click Text in the left pane of the Style Builder dialog box.

    The Text, Style Builder dialog box appears in the right pane.

Note

The Styles menu appears when you open an external CSS style sheet for editing. On the Styles menu, the Build Style option becomes available when you place the insertion point within the curly braces that follow the selector for a style rule.

A CSS style class defined in an external style sheet can be applied to an element within the <BODY> element of a Web page (in this case, including the <BODY> element itself) by assigning the CSS style selector as the CLASS property for the element.

Options available on the Text page of the Style Builder dialog box include the following.

Tasks

UI Elements

Alignment

Note

For the following alignment options, if you select <Not Set>, no code is added to the style.

  • Horizontal
    Sets the TEXT-ALIGN attribute value for text formatted in the style. Select <Not Set> (no option chosen), Left, Center, Right, or Justified. For example, if you choose Left, the following CSS markup is inserted:

    TEXT-ALIGN:left

    Note

    The Letters and Lines values that you set below are adjusted to accommodate the Justified attribute.

  • Vertical
    Sets the VERTICAL-ALIGN attribute value for text formatted in the style. Select <Not Set> (no option chosen), Subscript text, or Superscript text. For example, if you choose Subscript text, the following CSS markup is inserted:

    VERTICAL-ALIGN:sub

  • Justification
    Sets the TEXT-JUSTIFY attribute value for text formatted in the style. Select <Not Set> (no option chosen), Auto, Space words, Newspaper style, Distribute spacing, or Distribute all lines. For example, if you choose Newspaper style, the following CSS markup is inserted:

    TEXT-JUSTIFY:newspaper

    Note

    Justification attributes are available only if you select Justified for the horizontal value.

Spacing Between

These options set spacing between letters and vertical spacing between lines of text formatted in the style.

  • Letters
    Sets the value for horizontal spacing between letters of text formatted in the style. Select <Not Set> (no option chosen), Normal, or Custom. If you select Custom, the fields to the right of Custom are available. Enter a value from 1-512 in the number field and choose a unit option (px, pt, pc, mm, cm, in, em, or ex). The value that you set might be adjusted to accommodate the HORIZONTAL-JUSTIFIED attribute. The default unit option is pt. For example, if you choose Custom, type 5 in the number field, and then accept the default unit option, the following CSS markup is inserted:

    LETTER-SPACING:5pt

  • Lines
    Sets the value for vertical spacing between lines of text formatted in the style. Select <Not Set> (no option chosen), Normal, or Custom. If you select Custom, the fields to the right of Custom are available. Enter a value from 1 to 512 in the number field and choose a unit option (px, pt, pc, mm, cm, in, em, ex, or %). The default unit option is pt. For example, if you choose Custom, type 5 in the number field, and then accept the default unit option, the following CSS markup is inserted:

    LINE-HEIGHT:5pt

    Note

    The HORIZONTAL-JUSTIFIED attribute also modifies the vertical spacing of lines.

Text Flow

  • Indentation
    Sets the TEXT-INDENT attribute value for text formatted in the style. Enter a value from 1-512 in the number field and choose a unit option (px, pt, pc, mm, cm, in, em, ex, or %). The default unit option is pt. For example, if you type 5 in the number field and then accept the default unit option, the following CSS markup is inserted:

    TEXT-INDENT:5pt

  • Text Direction
    Sets the DIRECTION attribute value for text formatted in the style. Select <Not Set> (no option chosen), Left to right, or Right to left. For example, if you choose Left to right, the following CSS markup is inserted:

    DIRECTION:ltr

    Note

    When the attribute is <Not Set>, no code is added to the style.

See Also

Reference

Background, Style Builder Dialog Box

Font, Style Builder Dialog Box

Position, Style Builder Dialog Box

Layout, Style Builder Dialog Box

Edges, Style Builder Dialog Box

Lists, Style Builder Dialog Box

Color Picker Dialog Box

Concepts

Working with CSS Overview

Other Resources

Other, Style Builder Dialog Box