HTML Table format not showing in email preview mode but showing in new window

(0) Share

Report

Posted on by laclws

Dear Folks,

I'm having problem with my HTML table format not showing in email preview mode but showing in new window and also in my phone.

preview mode table format is not showing

but when open email in new window it is showing the format (the blue header table)

in my power automate flow

Anyone knows what's happening and how to solve it? Previously the HTML table format is alright showing in both preview and new window mode.

Thank you

Categories:

Power Automate Mobile App

I have the same question (0)

All responses (5)

Answers (0)

CU30121719-0 88 on at

Like (0)

Report
Copy link

Link copied!

Do not use CSS. Follow these AI-generated suggestions:

Inline Styles

Outlook does not support many CSS properties, so it's best to use inline styles for most elements.

Avoid Advanced Selectors

Avoid using advanced CSS selectors like :hover, :first-child, and sibling combinators as they are not supported.

Use Tables for Layout

Use tables for layout instead of CSS positioning. This ensures better compatibility across different email clients.

Test in Word

Since Outlook uses the Word rendering engine, you can open your HTML email in Word to see how it will render in Outlook.

By following these guidelines, you can create HTML emails that display correctly in Outlook and other email clients.

Was this reply helpful? Yes No
Chriddle 8,513 Super User 2025 Season 2 on at

Like (0)

Report
Copy link

Link copied!

Check if your CSS is supported by email clients.: www.caniemail.com

Was this reply helpful? Yes No
André Arnaud de Cal... 330 on at

Like (0)

Report
Copy link

Link copied!

Hi ,

Can you tell us what exact style coding you added in your flow (CSS output)? I recently created an email with HTML table which did meet the intended style in both the preview and when opening the email.

Was this reply helpful? Yes No
Suggested answer

David_MA 13,433 Super User 2025 Season 2 on at

Like (1)

Report
Copy link

Link copied!

You need to configure your e-mail message by putting it into HTML code view mode. To do that, click on </> in the Outlook action in the menu of the Body field. Then, you need to include CSS to format the table. For example:

<style>
Table {
font-family: Arial, Helvetica, sans-serif;
background-color: ; #EDF0F2;
border-collapse: collapse;
width: 100%;
max-width: 820px;
}
Table td, Table th {
border: 1px solid #ddd;
padding: 3px 3px;
}
Table th {
font-size: 15px;
font-weight: bold;
padding-top: 12px;
padding-bottom: 12px;
text-align: left;
background-color: #0038A6;
color: white;
}
</style>

Note, if you use the new designer, it is notorious for messing up the HTML code you apply. Therefore, if you use the new designer, I would suggest composing the body of the e-mail in a Compose action and put the output of the Compose action in the body of the e-mail.

In your screen shots, you show the CSS toward the bottom of the body of the e-mail. It needs to be at the top (first thing).

Was this reply helpful? Yes No
laclws 45 on at

Like (0)

Report
Copy link

Link copied!

Hi André Arnaud de Cal...,

Here is my style coding:

<style>
table {
font-family: Arial, Helvetica, sans-serif;
background-color: #EEEEEE;
border-collapse: collapse;
width: 100%;
}
table td, table th {
border: 1px solid #ddd;
padding: 3px 3px;
}
table th {
font-size: 15px;
font-weight: bold;
padding-top: 12px;
padding-bottom: 12px;
text-align: left;
background-color: #1C6EA4;
color: white;
}
</style>

It is showing in email new window but not in the preview mode. sometimes is like a glitch or something. I thought I saw it and the next moment the format is gone. Not sure what is happening. I'm sure the style is ok cause it is working before in both the new window and preview mode.

Was this reply helpful? Yes No