Exit
  • Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
  • 한국 커뮤니티
0

Nested lists display differently in Firefox vs IE7

New Here ,
Jun 03, 2009 Jun 03, 2009

Hi All, I hope you can help me out here.

I am having trouble getting nested lists to appear properly in Firefox as opposed to IE7.

The code that appears around the tex (list a, b, etc) is in the the graphic below (I could not upload the file and could not paste the code in here).

code2.png

code.png

Below is a screen capture showing you the problem.

lists_problem.png

Can you please help me fix this? I need to release the project by June 19 and we really don't want to say "for optimal viewing in IE7 or higher".

If I need to do something in the .css, please be detailed in your explanation, as I am still learning!

Thanks

Deborah

2.1K
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 03, 2009 Jun 03, 2009

Maybe this will help.

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


See www.grainge.org for RoboHelp and Authoring tips

Help others by clicking Correct Answer if the question is answered. Found the answer elsewhere? Share it here. "Upvote" is for useful posts.
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Jun 03, 2009 Jun 03, 2009

Hi Peter,

Many thanks for the tip to look at your website - I had bookmarked your site and then forgot to look there first.

The actual solution was based on your answer.

I removed the code applied manually to the style in the HTML file, and then edited the .CSS file.

I was planning on implementing one of your suggestions, but interestingly, once I fixed the <li> style in the cs with margin-left: 24px - everything came out great in IE7 AND Firefox.

Thanks for giving me a clue as to where to start fixing things.

Deborah

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Jun 04, 2009 Jun 04, 2009

Hi Peter,

I'm wondering if you could help me out. The problem is back again. It worked yesterday, no problem.

Today, everything is going crazy and I have no idea what to do. I've tried to place the Firefox code as well, then everything really went crazy.

There is either something wrong in my understanding of how things should work, or I've entered something incorrectly...

I wish I could type in the code for one of the styles so you could send an example of the solution for that styel - because I'm obviously missing something.

Thanks

Deborah

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 04, 2009 Jun 04, 2009

Hi there

You could type the code.

You could also grab a screen shot of it and insert the screen shot. If that's what you choose, please use the Camera icon and don't attach it.

Cheers... Rick

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Jun 04, 2009 Jun 04, 2009

Hi All,

Thanks for your patience with me. I do not know what happened. Yesterday - everything looked great after I entered changes in the li style. Today everything went wrong again.

I've spent several hours playing with the code, and finally found something that ALMOST works... the problem now is that there is way too much space between the letters and the text (a.              dog)  for example, instead of (a. dog).

troubleshooting2.png

OK, so the picture is way too small I guess, and I already reduce the size, I'll try to retype the code here: I'm changing the { to a [ so it will print and the . to a ",". Finally, please note that if I Manually edit the *-ns.css stylesheet and remove the margin-left command from the style P.OLDetail - then all looks good in Firefox and IE7 - but I am a contractor and if tomorrow I'm gone, who is going to get that information and remember it each time they generate a new Help file.

P,OLDetail [
            list-style:lower-alpha;
            margin-top:1pt;
            margin-bottom:5px;
            margin-left:24px;
            padding:0px;  ]
LI,P-OLDetail [
               list-style:lower-alpha;  ]
P,ULDetail [
            margin-top:1pt;
            margin-bottom:5px;
            list-style:square;  ]
HTML>BODY LI,P-OLDetail [
                         margin-left:24px;  ]
HTML>BODY OL [
              margin-left:0.00in;  ]

Thanks in advance,

Deborah

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 04, 2009 Jun 04, 2009

Hi there

What happens if you rename the NS.CSS file and copy the original CSS file and rename it to match the former NS.CSS file?

Better, Worse, Same or just Different?

Cheers... Rick

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Jun 04, 2009 Jun 04, 2009

Hi Rick,

Same - no change.

Deborah

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 05, 2009 Jun 05, 2009

Could the problem be that you have written your list styles as classes of the P tag rather than just defining the OL and UL tags?

You have P.OLDetail

I would write that as

OL.Detail

and apply the class to the list.

Also see Snippet 50 for information about various levels of indent. Check they work in the current Design Editors though. They may be OK in outputs and not in the Design Editor. I haven't tested that recently.


See www.grainge.org for RoboHelp and Authoring tips

Help others by clicking Correct Answer if the question is answered. Found the answer elsewhere? Share it here. "Upvote" is for useful posts.
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Jun 05, 2009 Jun 05, 2009

Hi Peter,

Thanks for the clues on where to look. I'll check out snippet 50 more carefully, and let you know what happens.

I don't really understand the P.OLDetail style myself...

Part of my struggle is that I am working with an inherited project that is a few years old. I am the third writer to work on this project... and am finding that most of it needs to be rewritten. Since it is massive, at this point in time, I'm hesitant to do anything that is going to require reapplying new styles.

I want the new writing in my topics (for a new module) to be correct, and am trying to get the rest of the stuff up to snuff, slowly in stages.

If I were to make entirely NEW styles only for my stuff, I wonder if that would work... but eventually, everything should be done the same... because I don't want whoever follows me to be faced with the nighmare I am faced with!

Anyway, I'll follow up on this after I've tried the suggestions in snippet 50.

Deborah

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Jun 05, 2009 Jun 05, 2009

OK, now the question is, will it stick.

I went back to manually editing the styles, and the following seems to have done the trick:

P.OLDetail {


    list-style: lower-alpha;

    margin-top: 0pt;


    margin-bottom: 5px;


    /*fixes space between bullet and text in Firefox*/

    margin-left: 10px;

    padding: 0px;

}



LI.P-OLDetail {

    list-style: lower-alpha;



    /*fixes margin in Firefox*/



    margin-left:24px



}

Now we shall see if stays there!

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 05, 2009 Jun 05, 2009
LATEST

See how it goes. I will be away for a while but contact me via my site in a week or so if want to discuss how to get from where you are to where you want to be. Include a link to this thread.


See www.grainge.org for RoboHelp and Authoring tips

Help others by clicking Correct Answer if the question is answered. Found the answer elsewhere? Share it here. "Upvote" is for useful posts.
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Resources
RoboHelp Documentation
Download Adobe RoboHelp