テキストのサイズを指定する際、文字数で幅を決めることが多々あります。PC、ブラウザ、内蔵するフォントの環境の違いがあっても、文字数指定ならば、想定したレイアウトを維持できます。そのようなケースでよく使われるのが、継承、指定されたフォントサイズを1とする単位の「em」ですが、テキストが全て半角で、marginなども半角1文字分を使いたいときに「em」では大きすぎることがあります。

その場合は、欧文の半角用単位の「ch」が便利かもしれません。「ch」は、半角数字の「0」の幅を1とする単位です。また、「ex」は半角欧文の小文字「x」の高さを1とする単位です。

サンプルは、半角数字6文字だけのli要素（背景色付き部分、幅は6ch）を横に並べたものです。
「NO.0」は、marginを0にしていて、liどうしがくっついています。
「NO.1」は、maginのtopとleftを1emにしています。
「NO.2」は、maginのtopを1ex、leftを1chにしています。
「NO.3」は、「NO.2」と同様で、font-familyを serifにしてあります。フォントの違いで、1chのサイズの違いが分かると思います。

サンプルのhtmlソース

<ul class="lng-ch">
  	<li class="center">NO.0</li><li>123456</li><li>123456</li><li>123456</li><li>123456</li>
  </ul>
  <ul class="lng-ch1">
  	<li class="center">NO.1</li><li>123456</li><li>123456</li><li>123456</li><li>123456</li>
  </ul>
  <ul class="lng-ch2">
  	<li class="center">NO.2</li><li>123456</li><li>123456</li><li>123456</li><li>123456</li>
  </ul>
  <ul class="lng-ch3">
  	<li class="center">NO.3</li><li>123456</li><li>123456</li><li>123456</li><li>123456</li>
  </ul>

• NO.0
• 123456
• 123456
• 123456
• 123456

• NO.1
• 123456
• 123456
• 123456
• 123456

• NO.2
• 123456
• 123456
• 123456
• 123456

• NO.3
• 123456
• 123456
• 123456
• 123456

サンプルのhtmlソース

ul.lng-ch,ul.lng-ch1,ul.lng-ch2,ul.lng-ch3 {
	border-bottom:1px solid #bbb;
	margin:1ex 0 0 0;
	}
ul.lng-ch1 {
	margin:1em 0 0 0;
	}
ul.lng-ch li,ul.lng-ch1 li,
ul.lng-ch2 li, ul.lng-ch3 li{
	list-style-type:none;
	width:6ch;
	text-align:right;
	display:inline-block;
	margin:0 0 0 0;
	padding:2px 4px;
	background:#ddf;
	}
ul.lng-ch1 li {
	width:6em;
	margin:0 0 0 1em;
	}
ul.lng-ch2 li {
	margin:0 0 0 1ch;
	}
ul.lng-ch3 li {
	margin:0 0 0 1ch;
	font-family:serif;
	}	
ul.lng-ch li.center,ul.lng-ch1 li.center,
ul.lng-ch2 li.center,ul.lng-ch3 li.center {
	text-align:center;
	background:#dff;
	}