下線の色が相違している

概要

　mobile版Firefoxと他ブラウザで、文字列の下に引かれる下線の色が相違します。

　以下のような要因が考えられます。

mobile版Firefoxで適用されるプロパティが他ブラウザで反映されない場合
text-decoration-color, text-decoration-line, text-decoration-styleに相当するプロパティが他ブラウザには存在しないため、表示の差異が発生します。
```
　　インライン {
	text-decoration: underline;
	-moz-text-decoration-color: -moz-use-text-color;
	-moz-text-decoration-line: underline;
	-moz-text-decoration-style: solid;
　　}			
```
色指定の方法に間違えている場合
例えば、以下のように記述されていると、下線の色は文字色となります。文字色の指定方法が間違っていた場合、下線の色が期待通りに設定されなくなります。
なお、text-decoration-colorは非推奨APIですのでCSS3準拠に書き替えが必要です。
```
　　text-decoration-color: -moz-use-text-color;			
```

　各要因の解決策の代表例として以下があります。

mobile版Firefoxで適用されるプロパティが他ブラウザで反映されない場合

例えば、Chromeでは下線色は文字色と等しくなり、個別設定ができません。
そのため、コンテンツタグの記述はFirefoxと他ブラウザとの見た目の統一が図れるよう、どのブラウザでもサポートしている装飾のみを用いる等の対処が必要です。
```
　　インライン {
	text-decoration: underline;
	-moz-text-decoration-color: -moz-use-text-color;
	-moz-text-decoration-line: underline;
	-moz-text-decoration-style: solid;
　　}			
```
色指定の方法に間違えている場合
text-decoration-color: -moz-use-text-color; を border-color: currentColor; に書き換えます。
なお、記載を修正してもまだ下線色が期待通りにならない場合は、フォント色の設定状態を確認することをお勧めします。
```
　　インライン {
	text-decoration: underline;
	border-color: currentColor;
	-moz-text-decoration-line: underline;
	-moz-text-decoration-style: solid;
　　}			
```

　・他のブラウザでも互換性を維持することができます。