Android Gingerbread およびこれより前のバージョンのモバイル Web サイトに問題があります。モノスペース フォントは、モノスペースのように正確に動作するとは限りません。異なる文字は異なる幅を持ちます。
これは、Gingerbread の既定の Web ブラウザーでどのように表示されるかです (Dolphin と Opera mini でもテストしました)。
これは、ICS の既定の Web ブラウザーでどのように表示されるかです。
WebからダウンロードしたCultive Monoを使用しました。
<link href='http://fonts.googleapis.com/css?family=Cutive+Mono' rel='stylesheet' type='text/css'>
CSS:
#my_id span{font:12px 'Cutive Mono', serif; line-height:1.6}
また、OS のデフォルトの等幅フォントも試しました。
#my_id span{font:12px monospace; line-height:1.6}
この問題を解決する方法を知っている人はいますか? モバイル Web サイトで作業するモノスペースが本当に必要です。
前もって感謝します。
編集
これは jsfiddle の例です: http://jsfiddle.net/HerrSerker/dE94s/9/