Uploaded image for project: 'Moodle'
  1. Moodle
  2. MDL-27774

HTML editor table border inconsistencies

    XMLWordPrintable

    Details

    • Database:
      MySQL
    • Testing Instructions:
      Hide
      1. In Moodle 2, Edit mode, Add a resource Page
      2. In the Contents box, Insert a new table
      3. In the Insert/Modify table, General tab, General properties, enter e.g. Cols 3; Rows 3 and Border 1
      4. Click the Advanced tab
      5. Set Frame="box" and Rules="all"
      6. Click Insert button
      7. In the WYSIWYG editor, check that your table shows borders around all cells.
      8. Fill in the table with your own data and click Save and display the page.
      9. You should see borders around all the cells in your table.
      Show
      In Moodle 2, Edit mode, Add a resource Page In the Contents box, Insert a new table In the Insert/Modify table, General tab, General properties, enter e.g. Cols 3; Rows 3 and Border 1 Click the Advanced tab Set Frame="box" and Rules="all" Click Insert button In the WYSIWYG editor, check that your table shows borders around all cells. Fill in the table with your own data and click Save and display the page. You should see borders around all the cells in your table.
    • Workaround:
      Hide

      This works (assuming users know CSS coding):
      <table style="border: 1px solid red;">
      <tbody>
      <tr>
      <td style="border: 1px solid red;">hello</td>
      <td style="border: 1px solid red;">hello</td>
      </tr>
      <tr>
      <td style="border: 1px solid red;">hello</td>
      <td style="border: 1px solid red;">hello</td>
      </tr>
      </tbody>
      </table>

      Show
      This works (assuming users know CSS coding): <table style="border: 1px solid red;"> <tbody> <tr> <td style="border: 1px solid red;">hello</td> <td style="border: 1px solid red;">hello</td> </tr> <tr> <td style="border: 1px solid red;">hello</td> <td style="border: 1px solid red;">hello</td> </tr> </tbody> </table>
    • Affected Branches:
      MOODLE_20_STABLE, MOODLE_22_STABLE, MOODLE_23_STABLE

      Description

      If you use the HTML editor in a resource page to create a table and set the border to 1, you will see cell and table borders in Firefox, but only table the border in IE. I did not verify Chrome and Safari, but heard that the missing cell border problem also appears in Safari.

      You can copy the HTML code generated from the Moodle's WYSIWYG editor and paste into a separate HTML document. When you open this document up, both Firefox and IE display both table and cell borders. This means something in Moodle or the WYSIWYG editor is breaking something.

      Replication instructions:

      1. Create page
      2. Add a table
      3. give it border of 1
      4. save
      5. view in Firefox 3.6 and IE 7

      Missing cell borders do not appear in IE 7 (and Safari as reported to me but not verified by me) using the standard theme and the custom theme on my moodle system.

      This bug may be related to MDL-20870 and MDL-27426.

        Attachments

        1. Classes.jpg
          Classes.jpg
          31 kB
        2. screenshot-1.jpg
          screenshot-1.jpg
          48 kB
        3. tinymce_table.patch
          0.8 kB

          Issue Links

            Activity

              People

              Assignee:
              nobody Nobody
              Reporter:
              felicia Felicia Berryman
              Participants:
              Component watchers:
              Andrew Nicols, Jun Pataleta, Michael Hawkins, Shamim Rezaie, Simey Lameze, Amaia Anabitarte, Carlos Escobedo, Ferran Recio, Sara Arjona (@sarjona), Víctor Déniz Falcón
              Votes:
              75 Vote for this issue
              Watchers:
              46 Start watching this issue

                Dates

                Created:
                Updated:
                Resolved: