You’re offline. This is a read only version of the page.
Hi everyone,
I'm having a bit of difficulty where I'm creating a HTML table in PA and utilising CSS to give it some styling, however the footer of the email also has a table which I do NOT want styled with the CSS.
I've tried using a replace compose operation similar to as follows with no luck, this is placed directly after the "Create HTML Table element of the flow.
replace(body('@{body('Create HTML Table')}'),'<table>','<table class=\"newtableID\">')
Any ideas?
Sorry, I got busy. Great that you sorted it yourself.
I've now resolved this by making the following changes to the flow: -
Compose - Data Operation (Positioned directly below the action to create the HTML Table
Share
Report
All responses (
Answers (replace(body('HTML_Table_for_AC_Systems'),'<table>','<table class=CustomTable>')
Then adjusted the Compose operation which held the CSS to reference the ID of the table (CustomTable) as per below.
<style>
.CustomTable {
font-family: Arial, Helvetica, sans-serif;
border: 1px solid #1C6EA4;
background-color: #EEEEEE;
width: 100%;
text-align: left;
border-collapse: collapse;
}
.CustomTable td, table.CustomTable th {
border: 1px solid #AAAAAA;
padding: 3px 2px;
}
.CustomTable tbody td {
font-size: 13px;
}
.CustomTable tr:nth-child(even) {
background: #D0E4F5;
}
.CustomTable thead {
background: #1C6EA4;
background: -moz-linear-gradient(top, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
background: -webkit-linear-gradient(top, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
background: linear-gradient(to bottom, #5592bb 0%, #327cad 66%, #1C6EA4 100%);
border-bottom: 2px solid #444444;
}
.CustomTable thead th {
font-size: 15px;
font-weight: bold;
color: #FFFFFF;
border-left: 2px solid #D0E4F5;
}
.CustomTable thead th:first-child {
border-left: none;
}
.CustomTable tfoot {
font-size: 14px;
font-weight: bold;
color: #FFFFFF;
background: #D0E4F5;
background: -moz-linear-gradient(top, #dcebf7 0%, #d4e6f6 66%, #D0E4F5 100%);
background: -webkit-linear-gradient(top, #dcebf7 0%, #d4e6f6 66%, #D0E4F5 100%);
background: linear-gradient(to bottom, #dcebf7 0%, #d4e6f6 66%, #D0E4F5 100%);
border-top: 2px solid #444444;
}
.CustomTable tfoot td {
font-size: 14px;
}
.CustomTable tfoot .links {
text-align: right;
}
.CustomTable tfoot .links a{
display: inline-block;
background: #1C6EA4;
color: #FFFFFF;
padding: 2px 8px;
border-radius: 5px;
}
</style>
Hope this helps anyone who has experienced the same issue
Hi Sudeep,
Thank you for offering your assistance with this! Screenshots as per below: -
Flow Overview
Get-Items from Sharepoint List and Create HTML Table action
CSS Styling with Table Output Appended
HTML Email Content #1
HTML Email Content #2
Please upload a screenshot of your flow
#1
stampcoin
14
#2
Churchy
12
#3
rzaneti
10
Super User 2025 Season 1
