Skip to main content
LaKisha1
LaKisha1
Inspiring
June 9, 2011
Answered

Additional Help with Bulleted Lists

  • June 9, 2011
  • 2 replies
  • 1694 views

Hello,

I've read this thread over and over, regarding issues with bulleted lists: http://forums.adobe.com/thread/452971

My problem is related (I think my lists could also be behaving oddly  due to them possibly being paragraph-style lists), but a bit different  so I wanted to create a new thread rather than add my questions to that  thread.

To illustrate my problem, I typed the text, then highlighted it, then selected the style from the Styles drop-down list to apply it to the highlighted text. This is what the outcome is:

Notice that the font I use for the numbers isn’t being picked up, and the disc bullets should actually be squares.

Here is the CSS information for these two styles:

P.UnorderedListFirstLevel {

            margin-top: 0pt;

            margin-bottom: 0pt;

            font-style: normal;

            font-variant: normal;

            font-weight: normal;

            color: #000000;

            list-style: square;

            font-size: 11px;

}

LI.P-UnorderedListFirstLevel {

            font-style: normal;

            font-variant: normal;

            font-weight: normal;

            color: #000000;

            list-style: square;

            font-size: 11px;

}

P.OrderedList {

            margin-top: 0pt;

            margin-bottom: 0pt;

            margin-left: 0pt;

            list-style: decimal;

            font-variant: normal;

            color: #000000;

            padding: 0pt 0pt 0pt 0pt;

            padding-bottom: 0pt;

            padding-left: 0pt;

            padding-right: 0pt;

            padding-top: 0pt;

            font-family: Verdana, sans-serif;

            font-style: normal;

            font-weight: normal;

            font-size: 11px;

            x-next-class: OrderedList;

            x-next-type: P;

}

LI.P-OrderedList {

            list-style: decimal;

            font-variant: normal;

            color: #000000;

            font-family: Verdana, sans-serif;

            font-style: normal;

            font-weight: normal;

            font-size: 11px;

}

Notice that for the unordered list, there is code for making the bullet a square (“list-style: square;”) and for the ordered list, there is code for formatting the numbers (“font-family: Verdana, sans-serif;”).

So here's my question: What can I do to fix the above code and make it work correctly like it does in RH7? Below is what the same list looks like in RH7, properly displaying, using the same exact code. Thanks in advance for all assistance!

    This topic has been closed for replies.
    Correct answer Willam van Weelden

    No sweat. You actually solved the problem yourself, but there is a problem with the case of your styles. (CSS class name selectors are case sensitive for XHMLT documents.)

    Amend your css like this:

    LI.P-UnorderedListFirstLevel,

    LI.p-UnorderedListFirstLevel {}

    LI.P-OrderedList,

    LI.p-OrderedList {}

    This should solve your problems.

    Greet,

    Willam

    2 replies

    R
    RoboAsh
    Participating Frequently
    June 9, 2011

    The CSS code that you have shared seems to be of an old version RoboHelp, If you are using any version > RH 8, I would suggest you to create new paragraph style through UI (either through Styles dialog or through "Styles and Formatting" POD right click options) and define you list while creating the paragraph style and use the paragraph level list it will keep a consistent list code and output

         

    Hope this will help

    Ashish

    Willam van Weelden
    Willam van Weelden
    Inspiring
    June 9, 2011

    Hi Ashish,

    What HTML/CSS results from setting this numbering format? If you use those settings, can you still work with lists in the same way as was done in RoboHelp 7 and earlier?

    Greet,

    Willam

    R
    RoboAsh
    Participating Frequently
    June 10, 2011

    Hi William,

                What LaKisha1 required was something else by just looking at the css what I deduced was different, this para-level list was introduced in RH 8 and I felt it was being referred, but only simple list was required here.

    To elaborate para-level list and Lists usage would be that you can have a continuous list (para-level) across the topic even if we place other paragraphs or blank lines in between.

    The same can be achieved in the simple list but will require additional HTML tweaking.

    See how it looks in RH design view below :-

    The HTML code looks like :-

    <ol type="1">

                <li>This </li>

                <li>is </li>

                <li>the </li>

    </ol>

    <p>&#160;</p>

    <p>text in between normal list</p>

    <p>&#160;</p>

    <ol type="1">

                <li>first </li>

                <li>topic </li>

                <li>in </li>

    </ol>

    <p>&#160;</p>

    <p>&#160;</p>

    <p>&#160;</p>

    <?rh-list_start level="1" an="1" class="rl-p-Para-List" ?><p class="Para-List">your

    </p><?rh-list_end ?>

    <?rh-list_start level="1" an="1" class="rl-p-Para-List" ?><p class="Para-List">project.

    </p><?rh-list_end ?>

    <p class="Para-List">&#160;</p>

    <p class="Para-List">text in between para list </p>

    <p class="Para-List">&#160;</p>

    <?rh-list_start level="1" an="1" class="rl-p-Para-List" ?><p class="Para-List">Delete

    </p><?rh-list_end ?>

    <?rh-list_start level="1" an="1" class="rl-p-Para-List" ?><p class="Para-List">this

    </p><?rh-list_end ?>

    <?rh-list_start level="1" an="1" class="rl-p-Para-List" ?><p class="Para-List">text

    </p><?rh-list_end ?>

    And the CSS :-

    p.Para-List {

                list-style: rh-list;

                x-list-class: rl-p-Para-List;

                x-list-level: 1;

    }

    rh-list.rl-p-Para-List {

                x-level-count: 1;

                x-lvl-1-format: "<x>.";

                x-lvl-1-type: decimal;

    }

    While generating the output the rendering is taken care of properly and all the PI code is removed.

    NB:-Yes you can work on it as you use to work in RH 7 and before ...

    Hope this might help

    Ashsih

    Willam van Weelden
    Willam van Weelden
    Inspiring
    June 9, 2011

    Hi,

    This is probably connected to the problem in the post you referenced. Did you also take a look on http://www.grainge.org/pages/authoring/lists/lists.htm?

    That said, can you post the HTML of the offending lists so we can see whats going on there? The CSS works as expected in a test page I created. It might be that your HTML need some tweaks.

    Greet,

    Willam

    LaKisha1
    LaKisha1Author
    Inspiring
    June 9, 2011

    William,

    Below is the HTML. Sorry, I did mean to include this in my original post and forgot. Also, no I did not look at the page you reference in your post, but I will do that right now.

    <ul>

        <li class=p-UnorderedListFirstLevel><p class=UnorderedListFirstLevel>hello</p></li>
        <li class=p-UnorderedListFirstLevel><p class=UnorderedListFirstLevel>goodbye</p></li>
        <li class=p-UnorderedListFirstLevel><p class=UnorderedListFirstLevel>sometimes</p></li>
    </ul>

    <ol>

        <li class=p-OrderedList><p class=OrderedList>hello</p></li>
        <li class=p-OrderedList><p class=OrderedList>goodbye</p></li>
        <li class=p-OrderedList><p class=OrderedList>sometimes</p></li>
    </ol>

    Message was edited by: LaKisha1

    Willam van Weelden
    Willam van WeeldenCorrect answer
    Inspiring
    June 9, 2011

    No sweat. You actually solved the problem yourself, but there is a problem with the case of your styles. (CSS class name selectors are case sensitive for XHMLT documents.)

    Amend your css like this:

    LI.P-UnorderedListFirstLevel,

    LI.p-UnorderedListFirstLevel {}

    LI.P-OrderedList,

    LI.p-OrderedList {}

    This should solve your problems.

    Greet,

    Willam

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices