Automation Email and HTML/CSS Formatting Issues

John Izquierdo March 27, 2024

Hello,

I'm setting up an automation to send a email notification to a group when an specific issue type is created but I'm having issues with the email formatting with HTML/CSS. Only some of the CSS is actually working and other parts aren't.

Specifically the stylizing for the divimg, and hr tags.

Below is my HTML in the Send Email action.

<html>
<head>
<style type="text/css">
.container{
margin: auto;
width: 60%;
padding: 10px;
font-family: Arial;
}
a {
text-decoration: none;
}
img {
height: 35px;
float: right;
}
</style>
</head>

<body>
<div class="container">
<p>{{issue.reporter.displayName}} <strong>created an issue</strong>.</p>

<hr style="border:1px solid red">

<p style="color:grey;">{{project.name}} / <a href="{{issue.url}}" style="color:grey;">{{issue.key}}</a></p>

<h2><a href="{{issue.url}}" style="color: #1963d1;">{{issue.summary}}</a></h2>

<p>
<strong>Description:</strong> {{issue.description}}
<br>
<br>
<strong>Issue Type:</strong> {{issue.issuetype.name}}
<br>
<br>
<strong>Priority:</strong> {{issue.priority.name}}
<br>
<br>
<strong>Created:</strong> {{issue.created.longDateTime}}
<br>
<br>
<strong>Reporter:</strong> {{issue.reporter.displayName}}
</p>

<hr style="border: 1px solid red">

<p style="color:grey;">Powered by Jira <img src="SOME-IMAGE-URL"></p>
</div>
</body>
</html>

 

According to W3Schools Try It page the result should look like the screenshot below.

screenshot-297.png

But the email I receive looks like...

screenshot-298.png

1 answer

0 votes
John Izquierdo March 28, 2024

Looks like the issue is how the Outlook desktop app is rendering the HTML/CSS. OWA seems to render it without issues.

 

I'm investigating some more to find a fix so that it renders correctly everywhere. I'll post my solution if I find one to possible help anyone else out there.

Suggest an answer

Log in or Sign up to answer
DEPLOYMENT TYPE
CLOUD
PRODUCT PLAN
PREMIUM
PERMISSIONS LEVEL
Site Admin
TAGS
AUG Leaders

Atlassian Community Events