Erin Sowards, Graphic and Web Design

Articles


Recent Articles

Convert Inches to Decimals

April 1, 2010

When I design printed materials, most of the time the dimensions I’m given are in fractions. I thought I would create a table of decimal conversions to refer to.


The Conversion Formula

The formula for converting inches to decimals is:

Take the first number in the fraction and divide it by the second number in the fraction.

1 unit ÷ 16 units = 0.0625

1 unit ÷ 8 units = 0.125

Inches in 1/16 Decimals
1/16   0.0625
2/16 1/8 0.125
3/16   0.1875
4/16 1/4 0.25
5/16   0.3125
6/16 3/8 0.375
7/16   0.4375
8/16 1/2 0.5
9/16   0.5625
10/16 5/8 0.625
11/16   0.6875
12/16 2/3 0.75
13/16   0.8125
14/16 7/8 0.875
15/16   0.9375
16/16 1 1.0

Align on Decimal? Sadly, No

As I was working on this table, I was curious if there was a way provided by CSS or HTML that allowed alignment of table cells by decimal point or charactor.

According to the W3C, there is an character alignment attribute called char, but it is not widely supported. Besides, the align attribute is deprecated anyway. If a browser doesn’t support character alignment, behavior in the presence of the char value is unspecified.

  1. <table>
  2. <colgroup></colgroup>
  3. <col><col align="char" char=".">
  4. <tr>
  5. <th>vegetable</th>
  6. <th>cost per pound</th>
  7. </tr>
  8. <tr>
  9. <td>lettuce</td>
  10. <td>$2.50</td>
  11. </tr>
  12. <tr>
  13. <td>carrots</td>
  14. <td>$3.50</td>
  15. </tr>
  16. <table>

Also, the text-align property could contain a “string” character, but that was scrapped in CSS 2.1 due to limited browser support.

  1. td {
  2. text-align: "."; /* Not supported */
  3. }

That seems strange to me, since tables are for storing data, that there is no easy way provided by the HTML language to align on decimal.

Designing since 2001. Lovingly made with HTML5, a dab of CSS3, and unobtrusive Javascript. Validate