This project is read-only.

Right aligned text in table cell

Sep 24, 2013 at 8: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:
  <style type="text/css">
      border-spacing: 0px;

      text-align: right;
      background-color: red;

  <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>

In the last tree rows, the text does not line up at the right edge of the cell.
Sep 24, 2013 at 9: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;
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.
Sep 24, 2013 at 11:52 AM
I pasted the html to the demo app and it works as expected...
Sep 24, 2013 at 12:00 PM
Edited Sep 24, 2013 at 12:05 PM
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 12:14 PM
I just created an example on to see how the code renders in a browser. You should be able to try it on this link: Both Firefox and Chrome renders the table so the numbers align above each other without additional space at the end for some cells.
Sep 24, 2013 at 2: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 2: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.