Moodle
  1. Moodle
  2. MDL-30396

left margin for ordered list not big enough for 2-digit numbers in styles based on canvas

    Details

    • Type: Bug Bug
    • Status: Closed
    • Priority: Minor Minor
    • Resolution: Duplicate
    • Affects Version/s: 2.1.2
    • Fix Version/s: None
    • Component/s: Themes
    • Labels:
    • Database:
      MySQL
    • Testing Instructions:
      Hide

      Create a numbered list in a course with arialist or nimble style, and have more than 9 items in the list. The list will appears to restart numbering at zero.

      Show
      Create a numbered list in a course with arialist or nimble style, and have more than 9 items in the list. The list will appears to restart numbering at zero.
    • Workaround:
      Hide

      In theme/canvas/style, I changed the left margin in text.css and editor.css (not sure if I needed to change one or both), but that made the margin enough to show both digits of the list. I separated the margins for the ordered versus unordered lists, and I don't know if there is a good reason to have the same margin for both types of lists.

      Show
      In theme/canvas/style, I changed the left margin in text.css and editor.css (not sure if I needed to change one or both), but that made the margin enough to show both digits of the list. I separated the margins for the ordered versus unordered lists, and I don't know if there is a good reason to have the same margin for both types of lists.
    • Affected Branches:
      MOODLE_21_STABLE
    • Rank:
      33018

      Description

      I was looking at one of my courses, and I noticed that an ordered (numbered) list in one section restarted the numbering at zero (see with 1.5em.png). I was using nimble style, and tried changing to arialist, but got the same results. Using the CSS inspector in Safari, I looked at the css styles for the list, and narrowed it down to the following css.

      ul, ol {
      margin: 0 1.5em 1.5em 1.5em;
      }

      I was not able to find anything like that in the arialist or nimble style, so I searched the base styles and found that editor.css and text.css in the canvas base style had that code. Using the CSS inspector, changing the last number (left margin) to 2em was enough the give a sufficient margin for a 2 digit number for the list.

      1. with 1.5em.png
        16 kB
      2. with 2em.png
        16 kB

        Issue Links

          Activity

          Hide
          Michael de Raadt added a comment -

          Thanks for providing a workaround for this issue. I'll suggest it in the original duplicated issue. However, what happens with lists with more digits? Perhaps the solution is to not control the width at all and allow the margin to be calculated appropriately by the browser.

          Show
          Michael de Raadt added a comment - Thanks for providing a workaround for this issue. I'll suggest it in the original duplicated issue. However, what happens with lists with more digits? Perhaps the solution is to not control the width at all and allow the margin to be calculated appropriately by the browser.

            People

            • Votes:
              0 Vote for this issue
              Watchers:
              0 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved: