Results 1 to 2 of 2

Thread: styles separated by <br> or line spacing?

  1. #1
    Join Date
    Aug 2007
    Posts
    3

    custom styles for <p> tags

    edit:

    I found the answer to my question. I figured I'd post it here for fellow newbs:

    Modifying the spacing in an individual <p> tag with a custom style
    You can also create a custom style and then apply it to paragraphs individually rather than redefining the <p> tag properties globally.

    1 Choose Text > CSS Styles > New Style.

    Or, choose Window > CSS Styles to open the CSS Styles panel, then click the New Style button.

    2 In the New Style dialog box, select This Document Only under Define in.

    3 Type a name, such as .nospace, in the Name text box.
    4 Select Make Custom Style (class) under Type.

    5 Click OK. The Style Definition dialog box appears.
    6 In the Style Definition dialog box, select the Box category.
    7 The following settings in the Box category will cause any elements with this style applied to display very little margin above or below it:

    Margin section
    Top: 0
    Right:
    Bottom: 2

    Left:

    Note:You may want to experiment with other numbers and settings to achieve a desired effect.

    8 Click OK. The nospace style will appear on the CSS Styles panel.
    9 In Design view, click inside the textual content of a <p> tag. Select the<p> tag from the Tag selector (the list of tags found at the bottom left of the Design window).
    10 Select the nospace style from the Styles panel.

    Note:If the text in the<p> tag is above another <p> tag, you may have to apply the nospace style to the <p> tag below as well, to eliminate the space between the two lines (compare Example 2 with Example 3 ). If the text in the <p> tag is above an image or a table, however, applying the nospace style to the <p> tag should eliminate the space between those two elements (see Example 4 ).
    Last edited by localflavor; 09 Aug 2007 at 09:39 PM. Reason: i found the answer

  2. #2
    Join Date
    Feb 2006
    Location
    Salisbury UK
    Posts
    4,332
    You don't say whether you are using a coding program like Dreamweaver or FrontPage but I think you are.

    The solution seems to be applying a class to the p tag that you want to be different.

    For people not using a coding program it would be:-

    HTML markup in the body:-
    <p class="nospace">Paragraph with different margins.</p>

    Style in style tags in head section or in a stylesheet:-

    .nospace { margin: 0 0 5px 0; } or whatever margins you want in the order top, right, bottom, left.
    Code downloaded to my PC will be deleted in due course.
    WIN7; IE9, Firefox, Opera, Chrome and Safari for Windows; screen resolution usually 1366*768.
    Also IE6 on W98 with 800*600 and IE8 on Vista 1440*900.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •