Skip to main content
T
tspaul
Inspiring
November 2, 2009
Answered

Getting lists to indent properly in Firefox

  • November 2, 2009
  • 1 reply
  • 2584 views

Hello,

We have recently been looking at our style sheet for WebHelp to overcome problems we've seen in some browsers. We have found in the KB that we can overcome the extra indentation for lists in Firefox by setting the padding. However, we are having a different Firefox problem with indented lists. We have an indent18 style that indents paragraphs 18 px. When we apply numbering or bullets to paragraphs with this style, the numbers and bullets indent with the paragraph text in IE, but not in Firefox. In Firefox, the numbers and bullets stay at our left margin, and only the paragraph text indents.

I have tried adjusting padding and margin-left specifications in the style sheet for the style and for OL or UL, but nothing seems to make this problem go away.

Has anyone else seen this or come up with a solution? Should we be using different styles for list items? If so, do we apply the style first and then select the numbering, or apply the numbering and then select a style for each list item?

Thanks in advance for any help you may be able to provide.

Tammy

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

I'm afraid this is not helping me. My goals are these:

-In indented sublists, get Firefox to indent the numbers and bullets with the paragraphs themselves.

-If possible, use the existing styles and not require the writers to go back and make extensive changes to what styles are applied - in other words, they would prefer that I could just provide a new style sheet that will solve the problem. Requiring them to apply different styles to all their topics could start a small-scale riot. :-)

So far I do not have a solution to this. I apologize if I am not understanding whether this is possible and what would need to change. Meanwhile, I'm continuing to look into this on my own.

Tammy


Hi,

The solutions may not be all that complicated. There are a couple of things you need to do (I guess you are using Robo8):

0. Back up your projects! You have to do some changes that CANNOT be undone.

1. Teach all writers to also use proper lists:

     i. Click the list button, right click and select Bullets and Numbering, go to the tab custom and select the desired list.  Small-scale riot

     ii. Create RH Multilevel lists

2. Create a corresponding list style for every paragraph that is used in a list. The Robo7 convention is LI.p-<paragraph name>. Add all relevant styling in this style. You may want to use this convention or something like this, because it sets a relation between the list style and the paragraph.

3. Add LI P {margin-left: 0 !important} to your style sheet

4. Use a find and replace to give all your list items classes, example:

<li><p class=indent18> will have to be replaced with: <li class="p-indent18"><p class="indent18">

This way you can update all your lists in a matter of minutes. Just figure out what paragraphs are used an create the corresponding find and replace operation.

1 reply

Peter Grainge
Community Expert
Peter GraingeCommunity Expert
Community Expert
November 2, 2009

See the second item.

http://www.grainge.org/pages/authoring/browsers/browsers.htm

See www.grainge.org for RoboHelp and Authoring tips

@petergrainge

Use the menu (bottom right) to mark the Best Answer or Highlight particularly useful replies. Found the answer elsewhere? Share it here.
T
tspaulAuthor
Inspiring
November 3, 2009

I did read through that page and several other forum posts before posting yesterday, but it didn't seem to answer my specific question. The text is indenting to the proper level, but the bullets and numbers are not.

Tammy

Willam van Weelden
Willam van Weelden
Inspiring
November 3, 2009

Here is the style sheet and a sample topic that my colleague has given me to test. I apologize for the missing graphics you'll see in the header. This is a generated WebHelp help topic, not pre-generation.

The style sheet might appear a bit crazy right now. I have been experimenting with different settings in the OL and UL tags and in the paragraph styles themselves, trying to come up with a solution. I have removed some things as they proved not to help.

Tammy


Hi,

I'm not sure what you want with the different indenting paragraphs. Do you only want to use them for lists, of also for indented text outside of lists?

The paragraph is set to have a left margin from the parent element (unless you specify a position as absolute or fixed). The paragraph will then indent 18 px within its parent element, in this case the list item. Firefox is displaying the list correct, while IE is not...

The solution is to use list classes and not paragraphs for the indent. You create them in the Robo css editor, or by creating LI. classes. Apply a style by right click, bullets and numbering, custom and then your style.

Set the indent in the list style. If you don't use the paragraphs for anything but lists, remove them from your style sheet and use a use the normal paragraph.

If you use these paragraphs for anything outside these lists, and you do want to use them in lists, add the following to your style sheet:

LI P {
    margin-left: 0 !important;   
}

This wil set the left margin of all paragraphs in lists to 0, thus correctly displaying your lists.

Greet,

Willam

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