CSS Text 3 standard-based options to 'fix' spaces between inline-blocks

HTML

<p>word-spacing: -100%; (at risk, doesn't seem to work anywhere)</p>

<p class="percent">
    <span>1</span>
    <span>2</span>    
    <span>3</span>
    <span>4</span>
    <span>5</span>
</p>

<p>word-spacing: -1ch for monospace font (where any character is 1ch wide), works in Firefox 10+, Chrome 27+, almost works in IE9+</p>

<p class="ch">
    <span>1</span>
    <span>2</span>    
    <span>3</span>
    <span>4</span>
    <span>5</span>
</p>

CSS

span {
    display: inline-block;
    padding: .5em;
    width: 2em;
    text-align: center;
    background: #eee;
    border-radius: .5em;
    font-family: sans-serif !important;
    word-spacing: 0 !important;
}

.percent {
    word-spacing: -100%;
}

.ch {
    font-family: monospace;
    word-spacing: -1ch;
}