CODEWITHSUNDEEP
cssmargin
D. WONG
D. WONG

Reputation: 59

White space margin (not images)

I would like to know why upon selecting, there is a white space on the left of L, D, W (you can see on certain columns). Take note that they are not images, but styled with a background, so display:inline doesn't come into play, does it?

Thanks.

Image here: http://i.imm.io/1mRPp.jpeg

<tr class="pos1">
    <td>1</td>
    <td class="posindicator"><img alt="" src="http://www.premierleague.com/etc/designs/premierleague/images/shim.gif" /></td>
    <td>(3)</td>
    <td class="club"><a href="http://www.premierleague.com/en-gb/clubs/profile.overview.html/newcastle">Newcastle Utd (S)</a></td>
    <td>2</td>
    <td><span class="form-win">W</span> <span class="form-win">W</span> <span class="form-nil">-</span></td>
    <td>6</td>
    <td><span class="form-lose">L</span> <span class="form-win">W</span> <span class="form-win">W</span></td>
    <td>6</td>
    <td><span class="form-win">W</span> <span class="form-win">W</span> <span class="form-win">W</span></td>
    <td>9</td>
</tr>

They are the same, just with different background colors.

.form-draw {
   background: #999;
   color: #fff;
   font-weight: bold;
   padding: 0;
   display: inline-block;
   width: 1.5em;
   height: 1.5em;
   line-height: 1.5em;
   text-align: center;
   vertical-align: middle;
}

Upvotes: 0

Views: 70

Answers (1)

Carlo Cannas
Carlo Cannas

Reputation: 3262

It's the whitespace character (U+0020) you left between the span elements, removing it the span boxes will be one next to the other.

Upvotes: 1

Related Questions