一部の値に括弧が含まれているため、配置が正しくない次の表があります。テーブルは html を使用してレンダリングされますが、データは C# で作成します。私は利用可能なjqueryを持っています。これらの言語のいずれかでアライメントを修正する方法はありますか?
| VALUE |
| 40% |
| 20% |
| (30%) |
| 10% |
括弧が原因で 30% が正しく配置されていないことに注意してください。
ありがとう、ジェームズ
サーバー側 (C#) でデータを構築しているため (数値であるため、右揃えにしたほうがよいでしょう)、データをクライアントに送信する前にスペースを追加できます。
(1) データを文字列に変換します。括弧が負であることが原因である場合は、文字列に変換するときに正の数にスペースを追加してください。文字列 (フォーマットの結果) への変換後に括弧が存在する場合は、")" で終わらない文字列値にスペースを追加します。
例: 数値の書式設定中:
string myFormat = "#0% ;(#0%)";
myValue.ToString(myFormat);
フォーマットの正の部分 (最初の部分) の後のスペースに注意してください。
例: データがすでに文字列の場合:
if (! stringValue.Substring(stringValue.Length - 1) == ")") {
stringValue += " ";
}
これで、正の数値 (または括弧で囲まれていない文字列) のデータにスペースが追加されました。
(2) このデータがクライアントに送信されたら、テーブル セルにcssを指定します。 text-align:right
ただし、フォントが比例している場合、これは整列しません。したがって、これらのセル (または列) にはモノスペースフォントを指定します。例えばfont-family: courier new
; また、次のこともわかりましたfont-family: verdana
。また、等幅であるかのように数値を適切に並べます。
私が考えることができる2つの解決策:
1) 常に括弧を追加します。必要がない場合は、背景と同じ色にします (実際の値を a でラップすることで実行できます<span>
)。誰かがテーブルでコピー&ペーストを使用している場合、これは機能しません。
2) 角かっこがない場合は角かっこの代わりにスペースを追加し、固定幅フォントと保存された空白で表のスタイルを設定します。
td {
font-family: monospace;
white-space: pre;
}
例: http://jsfiddle.net/GeraldS/SqB3X/
どちらのソリューションもあまりきれいではありません。Khawer の 2 番目の例を使用すると思いますが、これは、訪問者がブラウザのフォント サイズを変更しない場合にのみ機能します。