HTML table in user macro not respecting inline style
Platform Notice: Data Center Only - This article only applies to Atlassian products on the Data Center platform.
Note that this KB was created for the Data Center version of the product. Data Center KBs for non-Data-Center-specific features may also work for Server versions of the product, however they have not been tested. Support for Server* products ended on February 15th 2024. If you are running a Server product, you can visit the Atlassian Server end of support announcement to review your migration options.
*Except Fisheye and Crucible
Problem
Inline styling for HTML tables is not being respected. It is actually being stripped out and replaced with the following:
1
2
3
4
5
6
7
8
9
10
<table width="100%">
<tr valign="middle">
<td width="34">
<ac:image><ri:attachment ri:filename="$paramicon" /></ac:image>
</td>
<td>
<div class="tabletitle">$paramheading</div>
</td>
</tr>
</table>It is then processed into:
1
2
3
4
5
6
7
8
9
10
11
12
<table class="confluenceTable">
<tbody>
<tr>
<td class="confluenceTd">
<img class="confluence-embedded-image" src="<path_to_attachment>" data-image-src="<path_to_attachment>">
</td>
<td class="confluenceTd">
<div class="tabletitle">Boosh</div>
</td>
</tr>
</tbody>
</table>Workaround
We can get the styling we want by injecting style directly into the user macro. This will give us the handles we need to affect styling that will not be stripped out when the macro is rendered.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<style type="text/css">
table.wide_table{width: 100%;}
table.wide_table .image_cell{width: 34px;}
</style>
<table class="wide_table">
<tbody>
<tr>
<td class="image_cell">
<img class="confluence-embedded-image" src="<path_to_attachment>" data-image-src="<path_to_attachment>">
</td>
<td>
<div class="tabletitle">Boosh</div>
</td>
</tr>
</tbody>
</table>Was this helpful?