Right aligned text in table cell

Sep 24, 2013 at 7:36 AM
I'm trying to get text right aligned in a table cell, but it doesn't seem to work as I would hope. Please see the following example:
<html>
<head>
  <style type="text/css">
    table
    {
      border-spacing: 0px;
    }

    #right
    {
      text-align: right;
      background-color: red;
    }
  </style>
</head>

<body>
<table>
  <tr><td id="right">978</td><td>.3</td></tr>
  <tr><td id="right">922</td><td>.4</td></tr>
  <tr><td id="right">32</td><td>.554</td></tr>
  <tr><td id="right">27</td><td>.963</td></tr>
  <tr><td id="right">10</td><td>.782</td></tr>
</table>
</body>

</html>
In the last tree rows, the text does not line up at the right edge of the cell.
Sep 24, 2013 at 8:03 AM
I've found the following solution by changing this line in CssLayoutEngine.ApplyRightAlignment
float diff = right - lastWord.Right - lastWord.LeftGlyphPadding - lastWord.OwnerBox.ActualBorderRightWidth - lastWord.OwnerBox.ActualPaddingRight;
to
float diff = right - lastWord.Right - lastWord.OwnerBox.ActualBorderRightWidth - lastWord.OwnerBox.ActualPaddingRight;
If this is the right correction, then that a similar change should be done in ApplyCenterAlignment, as it uses the same approach for calculating the position.
Developer
Sep 24, 2013 at 10:52 AM
I pasted the html to the demo app and it works as expected...
Image
Sep 24, 2013 at 11:00 AM
Edited Sep 24, 2013 at 11:05 AM
I get the same result in the demo app as you illustrate. But as I see it, the numbers "32", "27" and "10" are not completely right aligned. There are about 2 pixels space at the right edge. It's only the widest items in the column that go to the edge, all other items have this 2 pixels space at the end. Try for instance changing "10" to "1010". The numbers "978" and "922" will now be moved and have 2 pixels space at the end.

The change I suggested above solves this. Also, I do not understand why some glyph padding should be included when aligning some texts and not others (it does for instance not affect "928" and "922")
Sep 24, 2013 at 11:14 AM
I just created an example on dabblet.com to see how the code renders in a browser. You should be able to try it on this link: http://dabblet.com/gist/6683271. Both Firefox and Chrome renders the table so the numbers align above each other without additional space at the end for some cells.
Developer
Sep 24, 2013 at 1:04 PM
You are correct and I believe the fix you suggested is good.
I think it's a left over from very old code that added glyph padding to every word.
Thx, will commit it.
Sep 24, 2013 at 1:27 PM
Great to hear. I'm looking forward for an update. No need to rush though, as I can use my custom build until then. Thanks.