Align Decimal Data in table column by decimal point, HTML5, CSS3

Question

I am building a wordpress plugin which is generating an HTML table and sending to gravityforms html block via shortcode.

My problem is that cell contents can contain

Answer 1

It might be overkill but I needed the same thing and just solved with a length of the output and adding whitespace based on that length.

I.e.:

if (strlen($meal_retail) == 5) {
echo "    ";
}
else (strlen($meal_retail) == 6) {
    echo "  ";
}

This lined up my decimals correctly with a bit of extra doing, and i'm sure an array could clean the above code up even nicer.

Additionally, i've been conforming my numbers adjusting with:

echo money_format('%i',$meal_retail)  (makes it a two decimal money number)

Just wanted to provide my solution as I was looking at this page before coming up with my own resolution.