span要素の動き
spanはソースコード上にある後続のスペースや改行を余白として反映してしまう。
例えば以下のように定義すると、間に余白が設定される。
ソースコード1
<span>テスト文字１</span>
<span>テスト文字２</span>
結果1
テスト文字１ テスト文字２
余白を入れたくない場合は、以下のように定義をする。
ソースコード2
<span>テスト文字１</span><span>テスト文字２</span>
結果2
テスト文字１テスト文字２
htmlを動的に生成する場合
htmlを動的に生成する場合は、むしろ逆のパターンで、ソースコード2のようになるため、余白が設定されない。
余白を設定したい場合は、マージンを設定する。
<span style="margin-right:3px;">テスト文字１</span><span>テスト文字２</span>