web
You’re offline. This is a read only version of the page.
close
Skip to main content

Notifications

Announcements

Community site session details

Community site session details

Session Id :
Power Automate
Unanswered

Flow Notifications

(0) ShareShare
ReportReport
Posted on by

Hello Experts

Created a notification email and I ran into the below issue. I am using HTML (see below example). Can't figure out how to align items with yellow arrows. The pink arrow is fine.

 

Allignment.jpgallignment2.jpg

Categories:
I have the same question (0)
  • AlanPs1 Profile Picture
    2,471 on at

    Hi @thejdofva , thank you for your post!

    Whilst you are using Flow, your issue is definitely more of an HTML/CSS issue that relates to formating tables within what looks like the body of an HTML email.

     

    Would the first example on this post be the beginnings of a better approach perhaps?

    https://html5-tutorial.net/tables/changing-column-width/

    https://html5-tutorial.net/try.html#pre0

     

    Also, it is possible to incorporate the full HTML layout within the email so you get a Head and Body section meaning you can style the table. So, you could have ...

    <html>
    <head>
     <style> 
    table {
     border-collapse: collapse;
     width: 100%;
     text-align: center;
    }
    td, th {
     border: 1px solid #ddd;
     padding: 4px;
    }
    th {
     padding-top: 8px;
     padding-bottom: 8px;
     background-color: #7F7D7E;
     color: white;
     font-weight: normal;
    }
     </style>
    </head>
    <body>
    <!-- content goes here -->
    </body>
    </html>

    and within ...

    <body>
    <!-- content goes here -->
    </body>

    Your table would be here and styled from above.

     

    <table border="1" width="100%">
    	<col style="width:40%">
    	<col style="width:30%">
    	<col style="width:30%">
    	<thead>
    	<tr>
    		<th>Fruits</th>
    		<th>Vitamin A</th>
    		<th>Vitamin C</th>
    	</tr>
    	</thead>
    	<tbody>
    	<tr>
    		<th>Apples</th>
    		<td>98 ui</td>
    		<td>8.4 mg</td>
    	</tr>
    	<tr>
    		<th>Oranges</th>
    		<td>295 ui</td>
    		<td>69.7 mg</td>
    	</tr>
    	<tr>
    		<th>Bananas</th>
    		<td>76 ui</td>
    		<td>10.3 mg</td>
    	</tr>
    	</tbody>
    </table>

    This approach should make it easier for you to style the table in the way you wish and advoid sizing and line issues that you are deomonstrating. Whilst this isn't the exact HTML or CSS you will need this would generally how you would start of if you have the need to use an HTML table. 

     

     

    If you have found my post helpful, please mark thumbs up.

     

    Any other questions, just ask.

     

    Thanks, Alan

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

Quick Links

Forum hierarchy changes are complete!

In our never-ending quest to improve we are simplifying the forum hierarchy…

Kudos to our 2025 Community Spotlight Honorees

Congratulations to our 2025 community superstars!

Leaderboard > Power Automate

#1
trice602 Profile Picture

trice602 398 Super User 2025 Season 2

#2
David_MA Profile Picture

David_MA 331 Super User 2025 Season 2

#3
Expiscornovus Profile Picture

Expiscornovus 203 Most Valuable Professional

Last 30 days Overall leaderboard