jQuery innerWidthを使って、テキストを囲む
span要素の幅を
取得、表示してレイアウト確認用サンプルに。
それぞれ、フォントがsans-serif系; line-height: 1.5; padding: 4px;
font-size: 20pxの場合：innerWidth: 97
font-size: 18pxの場合：innerWidth: 88
font-size: 16pxの場合：innerWidth: 80
font-size: 14pxの場合：innerWidth: 65
font-size: 12pxの場合：innerWidth: 57
それぞれ、フォントがserif系; line-height: 1.5; padding: 5px;
font-size: 18pxの場合：innerWidth: 97
font-size: 18pxの場合：innerWidth: 88
font-size: 16pxの場合：innerWidth: 80
font-size: 14pxの場合：innerWidth: 65
font-size: 12pxの場合：innerWidth: 57
