0 Replies Latest reply on Jul 23, 2009 9:03 AM by Peter Grainge

    List Indents in Firefox

    Peter Grainge Adobe Community Professional (Moderator)

      I know from my site stats and emails that I get, that lists having a different indentation in Firefox compared with IE gives many people a problem.


      I had to look into this again today and have found not only a solution but also the cause.


      In this thread
      http://bytes.com/groups/html/433256-ul-bigger-indent-firefox I learned that Firefox has a default left padding of 40px for lists. The solution given was to add the following line at the beginning of the CSS to get consistent results across browsers and then add margins to each selector as required.


      * {margin: 0; padding: 0;}


      Well it worked but I didn't really want to have to amend all the definitions in my CSS so instead I just added


      padding: 0px;


      to the OL and UL definitions and that did the job.


      It seems that as Firefox has a default padding of 40px in its own CSS, if your CSS does not have a padding definition to override that but does have a margin setting, the two get added together giving the wider indent you see in Firefox. Negate FF's padding in your own CSS and all is well with the world again.


      It's that simple. Please excuse me while I go and cry.


      See www.grainge.org for RoboHelp and Authoring tips