Approval email layout differs between devices

[lkaspar]

Hey guys

Is anyone else seeing formatting issues with the standard approval emails?

From the screenshots below,

The web version is the only one that produces the correct result (table correctly displayed, columns left aligned)

Mobile iOS and Power Automate app: column header is not left aligned.

Outlook Desktop Windows 10 - formatting is completely messed up.

Does anyone know why this is happening or what can be done about it?

Outlook web:

Outlook Web Chrome

Outlook mobile iOS:

Outlook Mobile iOS

Power Automate iOS:

Power Automate iOS

Outlook Desktop Windows 10:Outlook Desktop Windows 10

[Brad_Groux]

Each app or platform renders the HTML and markup language differently, thus the reason for the discrepancies from app to app and platform to platform. You can do your best to baseline them, but there will always be variations. If you provide a snapshot of your HTML/markup code, we may be able to offer some additional insight - but overall the differences you are showing are fairly common.

If this is functionality you would like to see added to Flow, a Flow Connector, or a Flow Template, please consider submitting it to the Flow Ideas page, where it can be voted on by other users, and tracked and commented on by the Flow team.

If this reply has answered your question or solved your issue, please mark this question as answered. Answered questions helps users in the future who may have the same issue or question quickly find a resolution via search. If you liked my response, please consider giving it a thumbs up. THANKS!

[lkaspar]

Hey @Brad_Groux

See screenshot below for what I am trying to display. It's just a simple table, ideally it should be a vertical table with the table headers in the left column and the table data in the right column. However, I couldn't figure out how to change direction of a table.

The biggest issue is the lack of formatting on desktop Outlook Windows 10 (last screenshot of OP) - this is where most of the users will be approving from.

Have I misconfigured something for it to not format the table at all on desktop windows outlook?

[Brad_Groux]

Outlook desktop will only display plain text or HTML for markup. Have you tried utilizing HTML rather than markup language for your table? You can utilize a DIV Generator to quickly try some mockups. 

If this reply has answered your question or solved your issue, please mark this question as answered. Answered questions helps users in the future who may have the same issue or question quickly find a resolution via search. If you liked my response, please consider giving it a thumbs up. THANKS!

[lkaspar]

Are you sure that's the case? I just created a test approval using the example at aka.ms/approvaldetails and it displayed fine in Outlook:

Using the Send an email action for my confirmation email, I am using HTML and it displays it just fine:

the reason I am using the markdown for approval is because it approvals don't support HTML:

[lkaspar · Accepted solution]

Hey @Brad_Groux 

I have figured it out. This is a strange one - I have removed the requestor (which was passed in as a trigger parameter) and the table is rendered with no issues. 

Thanks for your help