I want to right-align the last 3 columns of this table which is being generated by SQL (the headers are redacted from the example code below). This is difficult since the data is generated by a FOR XML statement.
Because it will be sent by email, only inline styling should be used (I’m not sure why but it works).
I’ve tried td:nth-last-child(-n+3)=text-align: right;
in various places but it’s always ignored.
How do I right align the last 3 columns?
SET @xml =
(
SELECT
[Cat] AS 'td','',
[SubCat] AS 'td','',
[Total1] AS 'td','',
[Total2] AS 'td', '',
[Total3] AS 'td', ''
FROM @SumTable ORDER BY Sort
FOR XML PATH('tr'), ELEMENTS
)
Set @XML = replace(@XML,'<td>','<td style=
"
border: 1px solid lightgray;
padding: 4px;
">')
Select @xml
Update
Chris Porter’s solution from this other question handles it perfectly. Create HTML Table with SQL FOR XML
When using FOR XML to generate the table, replace ‘td’ with temporary labels that can then be replaced. In the example below, I replace ‘td’ with ‘tdt’,’tdr’, and ‘tdrb’ and then replace them with the desired formatting.
SET @xml = --CAST(
(
SELECT
[Cat] AS 'tdt','', --TDT=treat as Text
[SubCat] AS 'tdt','', --TDT=treat as Text
[Total1] AS 'tdr','', --TDR=Right align
[Total2] AS 'tdr', '', --TDR=Right align
[Total3] AS 'tdrb', '' --TDRB=right align and bold
FROM @sumtable ORDER BY sort,[FT or PT],EnrollEndDtYm
FOR XML PATH('tr'), ELEMENTS
) --AS NVARCHAR(MAX))
--The html table has been made but with placeholder element names. Let's replace them with what we want:
Set @XML = replace(@XML,'<tdt>','<td style=
"
border: 1px solid lightgray;
padding: 4px;
">')
Set @XML = replace(@XML,'<tdr>','<td style=
"
text-align: right;
border: 1px solid lightgray;
padding: 4px;
">')
Set @XML = replace(@XML,'<tdrb>','<td style=
"
text-align: right;
font-weight: bold;
border: 1px solid lightgray;
padding: 4px;
">')
Set @XML = replace(@XML,'</tdt>','</td>')
Set @XML = replace(@XML,'</tdr>','</td>')
Set @XML = replace(@XML,'</tdrb>','</td>')
2
Answers
The answer is to use placeholder elements (instead of 'td') when creating the html table and then replacing them.
Please see the Update in the original post for more
Instead of
td:nth-last-child(-n+3)=text-align: right;
You can try an inline CSS style to the
<td>
elements of those columns using thenth-last-child()
Also try changing
For
This should add the inline style
text-align: right;
to the<td>
element of the third column (Total3), which aligns the text to the right.Sorry if I’m not providing the best example, it’s kinda hard to test!