スマホサイトの複数半角スペースについて

質問

PCやケータイでは有効な<pre>タグがスマホで効かず、半角スペースがまとめられてしまいます。
回避には<div style="white-space: pre-wrap;"></div>のようにwhite-spaceを使うようですが
これも効きません。（富士通isw13fで確認）
何か回避策ありますでしょうか？

回答No.2

MinervaAlice

<pre>タグ以外では、
半角スペースは、1行に連続して入れても1つ以上は無視されます。
よって、意図的に半角スペースを連続していれた意場合は、

半角スペース ＝ &nbsp;

なので「&nbsp;」を連続で記述すれば、いかがでしょうか？
スマホで検証してないのでわかりませんが。。。。

▼ソース
文字&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;文字

回答No.1

kamikami30

半角スペースをまとめるというと、
半角スペースが2つや3つ連続したとして、それが1つになるという意味でいいですかね？

他にまとめるという状態を想定できないのでもし違っていれば説明お願いします。

お礼

↑読み違えてました。すみません。おっしゃるとおりでした。
もともとはケータイサイトで文頭合せにスペースを使っており、問題なかったのですが、スマホではこのままでは表示ズレしてしまうので試行錯誤しています。

補足

まとめるのではなく、まとまってしまうという事です。例えば半角スペースを5つ並べても、1つでもスマホの表示上は1つです。
なお、white-space: pre-wrapは効いていたんですが、全角スペース＝半角スペース2個分ではないため、表示ズレしていました。
ケータイサイトならそれで良かったのですが、スマホに合せるとなるとかなり手こずりそうです。