スパンが垂直に表示されます

Question

私のページでページネーションを達成しようとしています。

<span height="40px"><span class="pg-normal" onclick="pager.prev();"> « Prev </span> 
| 
<span id="pg1" class="pg-selected" onclick="pager.showPage(1);" style="display: block;">1</span> 
<span id="sp1" style="display: block;">|</span> 
<span id="pg2" class="pg-normal" onclick="pager.showPage(2);" style="display: block;">2</span> 
<span id="sp2" style="display: block;">|</span> 
<span id="pg3" class="pg-normal" onclick="pager.showPage(3);" style="display: block;">3</span> 
    <span id="sp3" style="display: block;">|</span></span> 

このCSSの問題を除いてほぼ完了です。
私はJSFIDDLEを作成しました。私はそれが来ていない単線で結果をしたい。 どのようなヘルプも非常に便利です。

Answer 1

ザッツを参照してください。ここで

作品フィドルです： http://jsfiddle.net/sg3s/bGMa9/2/

あなたは彼らがあなたがdisplay: inline-blockを使用したり、ブロックレベル要素にすることができtekst流れのままに作るが、それらを作るためにfloat: left;を使用するブロック要素のようにそれらのスタイルではなく、したい場合は互いに隣に座る。

Answer 2

スパンは、display: block;と指定されているため、スタックされています。それを取り除くだけで、すべてインラインにする必要があります。

UPDATE

あなたは要素を表示し、非表示にしたいと述べました。インライン要素でそれを行うには、非表示の場合はdisplayをnoneに設定し、表示する場合は''（空の文字列）またはinlineと設定します。

は、彼らはすべてのスタイルdisplay: blockを持っているので、それはインラインtekstの流れからそれらを取り、別々の行にそれらを置くhttp://jsfiddle.net/bGMa9/4/