Moodle
  1. Moodle
  2. MDL-37775

Leatherbound theme : In the block "Add a block", the text in the listbox is centered (it should be left aligned)

    Details

    • Testing Instructions:
      Hide
      1. Using Firefox / Opera (where the problem is reproducible) and Explorer / Chrome / Safari (to verify nothing becomes broken)...
      2. Select Leatherbound theme via Theme selector or by URL
      3. Turn editing ON
      4. TEST to see that ADD a block title Add... and the resulting list (when Add... is clicked) are LEFT aligned and NOT centred.
      5. This should be true for all themes that use Canvas theme as a parent...these are:
        formal_white
        magazine
        arialist
        binarius
        boxxie
        brick
        formfactor
        fusion
        leatherbound
        nimble
        nonzero
        overlay
        serenity
        sky_high
        splash
      Show
      Using Firefox / Opera (where the problem is reproducible) and Explorer / Chrome / Safari (to verify nothing becomes broken)... Select Leatherbound theme via Theme selector or by URL Turn editing ON TEST to see that ADD a block title Add... and the resulting list (when Add... is clicked) are LEFT aligned and NOT centred. This should be true for all themes that use Canvas theme as a parent...these are: formal_white magazine arialist binarius boxxie brick formfactor fusion leatherbound nimble nonzero overlay serenity sky_high splash
    • Workaround:
      Hide

      /* Add block
      -------------------------*/

      .block_adminblock .content .singleselect

      { text-align: left; }
      Show
      /* Add block -------------------------*/ .block_adminblock .content .singleselect { text-align: left; }
    • Affected Branches:
      MOODLE_23_STABLE, MOODLE_24_STABLE, MOODLE_25_STABLE
    • Fixed Branches:
      MOODLE_23_STABLE, MOODLE_24_STABLE
    • Pull 2.4 Branch:
      MDL-37775_M24
    • Pull Master Branch:
      MDL-37775_master
    • Rank:
      47509

      Description

      Since I updated my moodle to 2.3.4+ (Build: 20130125), the text in the listbox is now centered, in the block "Add a block" with the theme "Leatherbound".
      With the standard theme, the text is still left aligned; so I guess it's a bug in the theme "Leatherbound" ?

      I noticed this behavior with Firefox (Windows XP and ubuntu), but not with Chrome (Windows XP).

      I did not find yet the lines in moodle files.

      The CSS lines (from Firebug) are :
      .noticebox, .expired, .notopenyet, .notifysuccess, .notifyproblem, .errorbox, .continuebutton, .singlebutton, .buttons, .singleselect

      { margin: 1em 0; text-align: center; }

      The HTML lines (from Firebug) are :
      <select name="bui_addblock" class="select autosubmit singleselect" id="single_select51092c565359a3"><option value="">Add ...</option>(...)</select>

        Issue Links

          Activity

          Hide
          Joseph Rézeau added a comment -

          This "mis-alignment" problem is not specific to the Leatherbound theme. It occurs also in latest Moodle 2.4 with quite a few of the current Moodle themes (Aardvard, Binarius, Brick, Leatherbound, etc.) but only with Firefox, no problem with MSIE or Chrome.

          I suspect this is due to some incompatibility between a CSS rule in Moodle's curent base CSS files and Firefox (18).

          Joseph

          Show
          Joseph Rézeau added a comment - This "mis-alignment" problem is not specific to the Leatherbound theme. It occurs also in latest Moodle 2.4 with quite a few of the current Moodle themes (Aardvard, Binarius, Brick, Leatherbound, etc.) but only with Firefox, no problem with MSIE or Chrome. I suspect this is due to some incompatibility between a CSS rule in Moodle's curent base CSS files and Firefox (18). Joseph
          Hide
          Mary Evans added a comment -

          It looks like it is actually coming from theme/canvas/style/core.css. I'm just testing it now.

          Show
          Mary Evans added a comment - It looks like it is actually coming from theme/canvas/style/core.css. I'm just testing it now.
          Hide
          Joseph Rézeau added a comment -

          well-spotted, Mary, the problem does come from theme/canvas/style/core.css, more specifically the unwanted addition of .singleselect to the list of elements with rule:
          text-align: center;
          margin: 1em 0;

          Joseph

          Show
          Joseph Rézeau added a comment - well-spotted, Mary, the problem does come from theme/canvas/style/core.css, more specifically the unwanted addition of .singleselect to the list of elements with rule: text-align: center; margin: 1em 0; Joseph
          Hide
          Mary Evans added a comment -

          @Joseph Rézeau

          Do you think it would be safe to take that .singleselect off the list? Or leave it and make ADD block .singleselect left aligned?

          Show
          Mary Evans added a comment - @ Joseph Rézeau Do you think it would be safe to take that .singleselect off the list? Or leave it and make ADD block .singleselect left aligned?
          Hide
          Joseph Rézeau added a comment -

          @Mary,
          I would take that .singleselect off the list.
          The fact that only Firefox seems to actually apply text-align:center to .singleselect seems to prove that that rule is useless. And anyway it does not make sense to center-align elements in a list.

          Show
          Joseph Rézeau added a comment - @Mary, I would take that .singleselect off the list. The fact that only Firefox seems to actually apply text-align:center to .singleselect seems to prove that that rule is useless. And anyway it does not make sense to center-align elements in a list.
          Hide
          Mary Evans added a comment -

          The fact is Joseph, that there are two instances of the CLASS selector singleselect in the ADD Block. The first is in a div tag, the second in a select tag that has an ID called "single_select".

          I have seen this in other themes and thought it was a feature. However, this is the first time it has been called a 'bug', so I better fix it.

          Show
          Mary Evans added a comment - The fact is Joseph, that there are two instances of the CLASS selector singleselect in the ADD Block. The first is in a div tag, the second in a select tag that has an ID called "single_select". I have seen this in other themes and thought it was a feature. However, this is the first time it has been called a 'bug', so I better fix it.
          Hide
          Mary Evans added a comment -

          @Pascal Maury I have just changed the title of this issue as it was a little ambiguous. It read as though it was a FireFox only bug, when in actual fact it wasn't, as the same behaviour can be seen in other browsers.

          I have come to the conclusion it was a design fault caused by the CSS I don't think it was intentional. It's been like that for a long time, it's just that no one spotted it, probably thought it was a new feature!

          Show
          Mary Evans added a comment - @ Pascal Maury I have just changed the title of this issue as it was a little ambiguous. It read as though it was a FireFox only bug, when in actual fact it wasn't, as the same behaviour can be seen in other browsers. I have come to the conclusion it was a design fault caused by the CSS I don't think it was intentional. It's been like that for a long time, it's just that no one spotted it, probably thought it was a new feature!
          Hide
          Joseph Rézeau added a comment -

          Mary "It read as though it was a FireFox only bug, when in actual fact it wasn't, as the same behaviour can be seen in other browsers."
          Well, actually, the faulty behaviour could be seen only in FF, not in Chrome nor MSIE. And the reason for this has still not been explained.

          Show
          Joseph Rézeau added a comment - Mary "It read as though it was a FireFox only bug, when in actual fact it wasn't, as the same behaviour can be seen in other browsers." Well, actually, the faulty behaviour could be seen only in FF, not in Chrome nor MSIE. And the reason for this has still not been explained.
          Hide
          Pascal Maury added a comment - - edited

          @Mary : no problem ! Thank you for working on this problem so quickly !

          Show
          Pascal Maury added a comment - - edited @Mary : no problem ! Thank you for working on this problem so quickly !
          Hide
          Mary Evans added a comment - - edited

          The same behaviour occurs in Opera as well as FireFox, Joseph.

          Chrome, Safari & IE9 seem to ignore it but if you look at the web developer tools in Chrome & IE you can see the center align CSS which appears to be ignored hence it looks normal with the left alignment.

          One could argue that it is a BUG with the other browsers and not FireFox and Opera as they are following the Moodle CSS and thus are working correctly!

          Show
          Mary Evans added a comment - - edited The same behaviour occurs in Opera as well as FireFox, Joseph. Chrome, Safari & IE9 seem to ignore it but if you look at the web developer tools in Chrome & IE you can see the center align CSS which appears to be ignored hence it looks normal with the left alignment. One could argue that it is a BUG with the other browsers and not FireFox and Opera as they are following the Moodle CSS and thus are working correctly!
          Hide
          Joseph Rézeau added a comment -

          Thanks for the interesting info, Mary. I trust your judgement in this matter.

          Show
          Joseph Rézeau added a comment - Thanks for the interesting info, Mary. I trust your judgement in this matter.
          Hide
          Mary Evans added a comment -

          Let's hope it passes the test and gets through Integration Review!

          Show
          Mary Evans added a comment - Let's hope it passes the test and gets through Integration Review!
          Hide
          Mary Evans added a comment -

          Thanks for reporting it pmaury!

          Show
          Mary Evans added a comment - Thanks for reporting it pmaury!
          Hide
          Eloy Lafuente (stronk7) added a comment -

          The main moodle.git repository has just been updated with latest weekly modifications. You may wish to rebase your PULL branches to simplify history and avoid any possible merge conflicts. This would also make integrator's life easier next week.

          TIA and ciao

          Show
          Eloy Lafuente (stronk7) added a comment - The main moodle.git repository has just been updated with latest weekly modifications. You may wish to rebase your PULL branches to simplify history and avoid any possible merge conflicts. This would also make integrator's life easier next week. TIA and ciao
          Hide
          Mary Evans added a comment -

          ALL BRANCHES REBASED

          Show
          Mary Evans added a comment - ALL BRANCHES REBASED
          Hide
          Eloy Lafuente (stronk7) added a comment -

          Integrated (23, 24 & master), thanks!

          Show
          Eloy Lafuente (stronk7) added a comment - Integrated (23, 24 & master), thanks!
          Hide
          Rossiani Wijaya added a comment -

          This is working as expected.

          Tested this for 2.3,2.4 and master with Chrome, FF and IE.

          Test passed.

          Show
          Rossiani Wijaya added a comment - This is working as expected. Tested this for 2.3,2.4 and master with Chrome, FF and IE. Test passed.
          Hide
          Damyon Wiese added a comment -

          Congratulations! This issue has been resolved. Thanks for helping to make Moodle better for everyone!

          Regards, Damyon

          Show
          Damyon Wiese added a comment - Congratulations! This issue has been resolved. Thanks for helping to make Moodle better for everyone! Regards, Damyon

            People

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

              Dates

              • Created:
                Updated:
                Resolved: