8 Replies Latest reply on Aug 18, 2009 7:16 AM by Willam van Weelden

    Editing the CSS in RH8

    painted8

      We recently upgraded from 5 to RH8, and I'm taking the opportunity to improve the css that I inherited.

       

      Is it not adviseable to do it in RH? Because in trying to set the formatting for steps and bulleted lists, I'm having a lot of difficulty. I'll have the indent set and when I try to match up the rest of the paragraph of the bulleted item, it's moving the original indent (or adding/removing space between the bullet and the paragraph). It seems really unstable. Doing all of this in FrameMaker was a breeze.

       

      Thanks.

        • 1. Re: Editing the CSS in RH8
          Peter Grainge Adobe Community Professional

          If you are talking about simple numbered or bulleted lists, editing within RH or using something like Top Style should both be OK. If you are talking about using RH's new multi-level lists, you'll struggle with any other editor than RH itself and they have proved troublesome for some people.

           


          See www.grainge.org for RoboHelp and Authoring tips

          • 2. Re: Editing the CSS in RH8
            notv4me

            I'm also having similar problems. We just upgraded from RoboHelp x5 to RoboHelp 8 and everything with the conversion was fine, but now the output of our project is not applying the template/CSS that we have.

             

            When we look at the topics in RH8, bullets and numbers are all fine. But when output for our users, all of the numbered lists, whether they were numbered or lettered, are all showing up as numbers. For example:

             

            In RH8 we have

             

            1.

                 a.

                 b.

                 c.

            2.

                 a.

                 b.

             

            But the output shows as

             

            1.

                 1.

                 2.

                 3.

            2.

                 1.

                 2.

             

            I have tried to edit the css to no avail, the changes just don't seem to stick. I then also copied out the css from our RHx5 project to overwrite the one that appears corrupted, but that did not help, either.

             

            Any help you can provide?

             

            Thanks!

             

            - WD

            • 3. Re: Editing the CSS in RH8
              painted8 Level 1

              WD -

               

              To get the 2nd level of 1, 2, 3, to be a, b, c, I think you have to go into the HTML and change the <ol type="1"> to <ol type="a">.

               

              Barry

              • 4. Re: Editing the CSS in RH8
                Peter Grainge Adobe Community Professional

                I wonder if the problem is that the lists were in fact defined as paragraph styles rather than OL and UL tags?

                 

                See http://forums.adobe.com/message/2167039#2167039

                 


                See www.grainge.org for RoboHelp and Authoring tips

                • 5. Re: Editing the CSS in RH8
                  notv4me Level 1

                  Thanks for the quick response!

                   

                  But I unfortunately do not know how/where to update these styles. I went into my css and confirmed that all of these items are listed under Paragraph, which is causing the problem. I was hoping there was a way to drag these styles out of "Paragraph" and into a different area of the css, but that's not an option and I don't know where I would edit this.

                  • 6. Re: Editing the CSS in RH8
                    Willam van Weelden Adobe Community Professional & MVP

                    Hi,

                     

                    Quickly dragging and dropping in your css probably won't work. Please post a html code of a defective list, so we can see what's going on.

                     

                    My guess is that your styles are applied to the paragraph, but not to the list item. You list probably looks like this

                     

                    <ol>

                         <li><p class="paragraph">Text</p></li>

                    </ol>


                    You want your list to look like this:

                    <ol>

                         <li class="p-paragraph"><p class="paragraph">Text</p></li>

                    </ol>


                    In your style sheet, define the numbering in the style LI.p-paragraph.

                     

                    If you want to do it by the book, do not define the list style in the list item, but in a list class, such as:

                     

                    <ol class="numbers">

                         <li><p>123</p></li>

                    </ol>

                     

                    Greet,

                     

                    Willam

                    • 7. Re: Editing the CSS in RH8
                      notv4me Level 1

                      I think this is what you are looking for; here is just a postion of one topic that should have lowercase letters but instead has numbers:

                       

                      Determine
                      Caller’s Emergency Situation</h2>
                      <ol>
                      <li class="p-TopicTextNumbered" style="font-size: 9pt;"><p class="TopicTextNumbered">Verify
                        caller is calling from address listed on <font style="font-weight: bold;">Overview</font>
                        window.</p></li>
                      </ol>
                      <p>&#160;</p>
                      <?rh-align_start align="left" ?>
                      <table style="border: Outset 1px #c0c0c0;" width="100%">
                      <col style="width: 50%;" />
                      <col style="width: 50%;" />
                      <tr style="height: 26px;" valign="top">
                        <td style="border: Inset 1px #808080; width: 50%; padding-right: 10px;
                          padding-left: 10px;"><p class="TableText" style="font-weight: bold;
                                text-decoration: underline; ">If...</p></td>
                        <td style="border: Inset 1px #808080; width: 50%; padding-right: 10px;
                          padding-left: 10px;"><p class="TableText" style="font-style: normal;
                                font-weight: bold; text-decoration: underline; ">Then...</p></td>
                      </tr>
                      <tr style="height: 48px;" valign="top">
                        <td style="border: Inset 1px #808080; width: 50%; padding-right: 10px;
                          padding-left: 10px;"><p class="TableText">Caller is calling
                         from address listed on <font style="font-weight: bold;">Overview</font>
                         window <font style="font-weight: bold;" color="#FF00FF">or</font>
                         caller does not know address for sure…</p></td>
                        <td style="border: Inset 1px #808080; width: 50%; padding-right: 10px;
                          padding-left: 10px;"><ol>
                         <li class="p-TableTextAlpha"><p class="TableTextAlpha">Verify
                          caller’s name.</p></li>
                         <li class="p-TableTextAlpha" style="font-size: 8pt;"><p class="TableTextAlpha">Continue
                          to next numbered step.</p></li>
                        </ol>
                        <p class="TableText">&#160;</p></td>
                      </tr>
                      <tr style="height: 42px;" valign="top">
                        <td style="border: Inset 1px #808080; width: 50%; padding-right: 10px;
                          padding-left: 10px;"><p class="TableText">Caller is <font
                         style="font-weight: bold;" color="#FF00FF">not</font> calling
                         from address listed on <font style="font-weight: bold;">Overview</font>
                         window…</p></td>
                        <td style="border: Inset 1px #808080; width: 50%; padding-right: 10px;
                          padding-left: 10px;"><ol>
                         <li class="p-TableTextAlpha"><p class="TableTextAlpha">Get
                          caller’s name, telephone number including area code, street
                          address, city, <font style="font-weight: bold;" color="#FF00FF">county</font>
                          and state caller is calling from.</p></li>
                         <li class="p-TableTextAlpha" style="font-size: 8pt;"><p class="TableTextAlpha">911
                          will help no matter where caller is calling from.</p></li>
                         <li class="p-TableTextAlpha" style="font-size: 8pt;"><p class="TableTextAlpha">Continue
                          to next numbered step.</p></li>
                        </ol>
                        <p class="TableText">&#160;</p></td>
                      </tr>
                      </table>
                      <?rh-align_end ?>

                      • 8. Re: Editing the CSS in RH8
                        Willam van Weelden Adobe Community Professional & MVP

                        Hi,

                         

                        In your style sheet (use an external editor such as Notepad++), find LI.p-TableTextAlpha and add the following markup:

                         

                        list-style-type: lower-alpha ;

                         

                        You can add the !important rule, when only adding the markup doesn’t work. In that case, LI.p-TableTextAlpha has the following markup:

                         

                        list-style-type: lower-alpha !important;

                         

                        If you have any other list with the same sort of problem, move the list-style or list-style-type attributes from the paragraph to the corresponding list item. If your paragraph is TableTextAlpha, the corresponding list type is p-TableTextAlpha. If the classes don't exist in your stylesheet, just create them.

                         

                        Greet,

                         

                        Willam