Table with class="fixed-table wrapped" not rendering correctly

XMLWordPrintable

    • Type: Bug
    • Resolution: Unresolved
    • Priority: Medium
    • None
    • Affects Version/s: 7.13.7, 7.19.4, 9.2.8
    • Component/s: Content - Page
    • None
    • 9
    • Severity 3 - Minor
    • 64

      Problem

      Tables with class="fixed-table wrapped" not rendering correctly.

      It's not known why a table is being created with this class, found that the default is class="relative-table wrapped"

      Steps to Reproduce

      1. Access Confluence
      2. Create a new page with the following storage format:
        <table class="fixed-table wrapped">
          <tbody>
            <tr>
              <th>asdasdasdasdasdasdasdasdasdasdasdasd</th>
              <th>asdasdasdasdasdasdasdasdasdasdasdasd</th>
              <th>asdasdasdasdasdasdasdasdasdasdasdasd</th>
            </tr>
            <tr>
              <td>asdasdasdasdasdasdasdasdasdasdasdasd</td>
              <td>asdasdasdasdasdasdasdasdasdasdasdasd</td>
              <td>asdasdasdasdasdasdasdasdasdasdasdasd</td>
            </tr>
            <tr>
              <td>asdasdasdasdasdasdasdasdasdasdasdasd</td>
              <td>asdasdasdasdasdasdasdasdasdasdasdasd</td>
              <td>asdasdasdasdasdasdasdasdasdasdasdasd</td>
            </tr>
            <tr>
              <td>asdasdasdasdasdasdasdasdasdasdasdasd</td>
              <td>asdasdasdasdasdasdasdasdasdasdasdasd</td>
              <td>asdasdasdasdasdasdasdasdasdasdasdasd</td>
            </tr>
          </tbody>
        </table> 
      1. Save the page

      Expected Results

      On view or edit mode.

      Actual Results

      On editor:

      On View mode you can see it like in the editor or like below:

      Workaround

      There are some known workarounds, for this, edit the page with the Source Editor and:

      • Change the table class to the class relative-table wrapped like this: <table class="relative-table wrapped">

      or

      • Add to the style="width: xx%;"  attribute like this: <table class="fixed-table wrapped" style="width: 50%;">
      • Alternatively, you can add the following to your global CSS stylesheet:
        .confluenceTable.fixed-table { 
        table-layout: auto; width: 100%; 
        }
        

        (reduce the percentage if you do not want the table to take up the whole width of the page)

      You will also need to add the code in all Space stylesheet that you may have, as the space config overwrite the global stylesheet.

       

            Assignee:
            Unassigned
            Reporter:
            Filipe Rodrigues
            Votes:
            26 Vote for this issue
            Watchers:
            26 Start watching this issue

              Created:
              Updated: