1

Currently I have this rendered HTML table (in dark mode):-
renderedhtmltable
As you can see each data in column "Currency" and "Total" has the RM currency symbol which always 1 space before the figures. What I want to achieve now is to have both columns being formatted that would display like below in html email body :-
expectedoutput
The currency symbol RM should always justified on the left while the number should always justified on the right in the same cell. As u can see more digits in the number, the nearer it become towards the currency symbol,the space between the symbol RM and the number should depend on the width of the cell:-

I have tried using div as answered in Right align and left align text in same HTML table cell. Below is the html code I've tried so far:-

<td nowrap>
  <div style="float:left;width:8px">RM</div>
  <div style="float:right;">123444948</div>
</td>

But I noticed this method has caused the display font overall shrinks way too much because it tries to retain a far gap between the currency symbol and the figure even after I have strictly set the width for div with RM is just 8px. I want it to be flexible, just like how we can see it when we apply this type of formatting in gsheet.Is this even possible? Thanks.

dell
  • 171
  • 13
  • That isn't HTML. Please provide the rendered HTML preferably as a [MCVE]. Make it as easy as possible for us to help you. Also avoid using inline styles, unless this is for an HTML email – Jon P Oct 16 '20 at 04:42
  • I have added the rendered HTML, @Jon P – dell Oct 16 '20 at 08:53

2 Answers2

1

use format "#,##0.00" and just add the letters You wish before the hash if you want it to appear before or after 0 if you want it after ,,,

ex: "SAR #,##0.00"

output example : SAR 90,200.00

I.MO
  • 9
  • 2
  • I've tested this before. But the currency symbol has always appeared one space before the figures and that is not what I want. I want the currency symbol to permanently 'stuck' on the left side in the cell while the figure is always 'stuck' on the right side in the same cell. But thanks for the effort to give an alternative solution. – dell Aug 06 '21 at 05:19
0

You can split into two cells like this. Need some touch up on the borders though.

<table>
<thead>
  <tr>
    <th style="text-align:center">Description</th>
    <th style="text-align:center">Number</th>
    <th style="text-align:center" colspan="2">Currency</th>
    <th style="text-align:center" colspan="2">Total</th>
  </tr>
</thead>
<tbody>
  <tr>
    <td>Item1</td>
    <td>1</td>
    <td style="text-align:left">RM</td>
    <td style="text-align:right">2.00</td>
    <td style="text-align:left">RM</td>
    <td style="text-align:right">20,000.00</td>
  </tr>
    <tr>
    <td>Item2</td>
    <td>2</td>
    <td style="text-align:left">RM</td>
    <td style="text-align:right">12.00</td>
    <td style="text-align:left">RM</td>
    <td style="text-align:right">500,000.00</td>
  </tr>
    <tr>
    <td>Item3</td>
    <td>3</td>
    <td style="text-align:left">RM</td>
    <td style="text-align:right">1,233.00</td>
    <td style="text-align:left">RM</td>
    <td style="text-align:right">12,345,678.00</td>
  </tr>
    <tr>
    <td>Item4</td>
    <td>4</td>
    <td style="text-align:left">RM</td>
    <td style="text-align:right">50.00</td>
    <td style="text-align:left">RM</td>
    <td style="text-align:right">200.00</td>
  </tr>
    <tr>
    <td>Item5</td>
    <td>5</td>
    <td style="text-align:left">RM</td>
    <td style="text-align:right">312,356.00</td>
    <td style="text-align:left">RM</td>
    <td style="text-align:right">8.00</td>
  </tr>
    <tr>
    <td>Item6</td>
    <td>6</td>
    <td style="text-align:left">RM</td>
    <td style="text-align:right">4.00</td>
    <td style="text-align:left">RM</td>
    <td style="text-align:right">78,392.00</td>
  </tr>
    <tr>
    <td>Item7</td>
    <td>7</td>
    <td style="text-align:left">RM</td>
    <td style="text-align:right">113.00</td>
    <td style="text-align:left">RM</td>
    <td style="text-align:right">234,879,234,934.00</td>
  </tr>
  <tr>
    <td style="text-align:right" colspan=4>Sum Up</td>
    <td style="text-align:left">RM</td>
    <td style="text-align:right">234,892,179,212.00</td>
  </tr>
  <tr>
    <td style="text-align:right" colspan=4>Some Cents</td>
    <td style="text-align:left">RM</td>
    <td style="text-align:right">0.56</td>
  </tr>
  <tr>
    <td style="text-align:right" colspan=4>Other service</td>
    <td style="text-align:left">RM</td>
    <td style="text-align:right">1.88</td>
  </tr>
    <tr>
    <td style="text-align:right" colspan=4>Total</td>
    <td style="text-align:left">RM</td>
    <td style="text-align:right">234,892,179,214.44</td>
  </tr>
</tbody>
</table>
Jay Tang
  • 43
  • 5