What I need

Protein      8g   25%
Fiber        1g    3%
<a><span style="float:right">8g &nbsp; &nbsp; 25%</span> Protein</span></a>
<a><span style="float:right">1g &nbsp; &nbsp; 3%</span> Fiber</span></a>

This code doesn't work when the percent values differ. It makes all the gram values ragged. Can you help me with this?

im not sure wht ur trying to ask buddy please elaborate

I need this

_1g____1%
_2g___10%
34g__100%

where the "_" characters are blank spaces.

even better

___1g_____1%
___2g____10%
__30g___100%

instead of

___1g____1%
_20g____20%
___5g____5%

I can write sprintf commands in Ruby.. sprintf "Protein %3.1fg%4.0f%%", @grams, @daily_value Unfortunately, html doesn't pick up the spacing outside a <pre> element, and my css doesn't like what I'm trying to do with the <pre> element.

Use the style text-align: right; .

This is a good place to put in a table with no borders.

you mean like this? Protein <table><tr><td>2 g</td><td>5%</td></tr></table>

Yes. Then apply a style to the td tag that aligns the text to the right.

<style type="text/css">
.rt {text-align: right;}
</style>
.....
<table>
  <tr>
    <td>Protein</td>
    <td class="rt">8g</td>
    <td class="rt">25%</td>
  </tr>
  <tr>
    <td>Fiber</td>
    <td class="rt">1g</td>
    <td class="rt">3%</td>
  </tr>
</table>