Texts with class="confluence-embedded-file-wrapper confluence-embedded-manual-size"are not displayed correctly

XMLWordPrintable

    • 13
    • Severity 3 - Minor
    • 22

      Problem

      Texts with class="confluence-embedded-file-wrapper confluence-embedded-manual-size" options are displayed incorrectly in Confluence 9

      Environment

      Confluence 9

      Steps to Reproduce

      1. Install Confluence Source Editor
      2. Create a new page and save it.
      3. Edit the page and click the <> button 
      4. Add the following example storage format:  
           <span class="confluence-embedded-file-wrapper confluence-embedded-manual-size">
    <span style="color: rgb(51,51,51);text-decoration: none;">
      <span style="color: rgb(23,43,77);">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</span>
    </span>
  </span>
      1. Publish the page

      Expected Results

      The text should be displayed as it was shown in the editor.

      Actual Results

      Render as shown in edit mode.

      Workaround

      Editing the page and reapplying the text format using the UI seems to fix the issue. It converts the source to something like this:

      <p>          Lorem ipsum dolor sit amet, consectetur adipiscing elit.     <span class="confluence-embedded-file-wrapper confluence-embedded-manual-size">   </span>
</p>

      Another possible workaround is to use the custom CSS below. 

      .wiki-content .confluence-embedded-file-wrapper.confluence-embedded-manual-size {
max-width: none !important;
}

      CSS steps

      You can apply the CSS workaround, you have two main options depending on how widespread the issue is:

      Option 1 – Apply site-wide (recommended if the issue affects many spaces)

      1. Go to Confluence Administration > Look and Feel > Custom HTML.
      1. In the At end of the HEAD section, add the following code:  
        <style>.wiki-content .confluence-embedded-file-wrapper.confluence-embedded-manual-size { max-width: none !important; }</style>
      1. Save your changes. This will apply the fix across all spaces on your instance.

      Option 2 – Apply to a single space

      1. Navigate to the affected space.
      1. Go to Space Tools > Look and Feel > Stylesheet-> Space StyleSheet
      1. Click Edit and add the following CSS rule (note that <style> tags are not needed here):  
        <style>.wiki-content .confluence-embedded-file-wrapper.confluence-embedded-manual-size { max-width: none !important; }</style>
      1. Save and refresh the affected pages to confirm the layout displays correctly.

      If the issue is widespread, the global method (Option 1) is much more efficient. For isolated cases, the space-level approach (Option 2) keeps the change contained. I have tested both in my local instance running 9.2.19, and it works fine.

      Notes

        1. image-2025-05-07-10-42-10-567.png
          image-2025-05-07-10-42-10-567.png
          11 kB
        2. image-2025-05-07-11-09-38-059.png
          image-2025-05-07-11-09-38-059.png
          19 kB

              Assignee:
              Nam Ho
              Reporter:
              Filipe Rodrigues (Inactive)
              Votes:
              21 Vote for this issue
              Watchers:
              34 Start watching this issue

                Created:
                Updated:
                Resolved: