[Solved] Decimal Alignment in CSS

[Robert Hieger]

I am currently studying PHP and I am trying to decimal-align contents appearing within <td> elements of two columns.

Perhaps a silly question, but I have thus far been unable to uncover a property even in CSS3 that would allow me to decimal align this content.

Any insight/help is greatly appreciated.

Thanks in advance.

Sincerely,

Robert Hieger

[Atelierbram]

Do you use a monospaced font?

[Robert Hieger]

No, I am using a proportionally-spaced font. Are you suggesting that this might be the problem?

[Atelierbram]

Aligning stuff in a table is difficult enough as it is. Because characters in a monospace font have all the same width, this is what I end up using most of the time, … makes sense I think. Like here in this thing.

[Paulie_D]

This might help: http://stackoverflow.com/questions/1363239/aligning-decimal-points-in-html

[Robert Hieger]

Thanks. If I am understanding the code correctly, you are using an <iframe> element and a mono-spaced font to achieve the effects in your codepen.

However, unfortunately, the CSS stylesheet is rendered (at least in codepen) as one continuous string with no white space. It is therefore quite difficult to decipher.

I am also concerned with using semantically appropriate HTML5. The data I wish to display is semantically appropriate to a table and not an iframe element.

Use of the mono-spaced font does make sense to me, however. Thanks again for your input. I will definitely examine your CSS and HTML code more closely.

Sincerely,

Robert Hieger

[Robert Hieger]

Thank you. So far, this solution looks the most promising, though I am going to have to bone up on my study of jQuery. I only have basic JavaScript skills, so this will be a stretch, but I’m game.

In the meantime, I will keep trying. To those setting the HTML5 and CSS standards, hopefully the message is getting out that it is high time that there is a standardized means of decimal alignment within tables. This would seem to be a rudimentary necessity for many a web site.

[Atelierbram]

Should have pasted the link to the editor-view of the Codepen …, oh well.
Best is to go with that Krijn Hoetmer article from the stackoverflow link that Paulie_D posted.

[Robert Hieger]

Thank you. Now that you’ve posted the link to the editor-view in Codepen, I will try to study the CSS, though at first glance, it looks as though this supersedes my current level of knowledge.

Not to worry, I’ll just continue studying–that is, both your example and the article linked by Paulie_D.

Surprising that this should be such a difficult problem, but then both CSS and HTML are full of tiny surprises.

Again, my thanks.

[Author]

Posts