HTML|CSS: Space between input buttons

Question

I have a problem in which I have a space between these two buttons as seen in the image below:

The code is as follows:

<input id="NeedBtn" class="PostBtn" type="button" />
<input id="ProvBtn" class="PostBtn" type="button" />

.PostBtn
{
   background: url(../Images/Buttons/PostButtonF.png) no-repeat;
   width: 50px;
   height: 28px;
   border: none;
   margin: 0;
   padding: 0;
}
#NeedBtn
{
   background-position: 0 0;
}
#ProvBtn
{
   background-position: -50px 0;
}

How do I remove that space?

Browser: Firefox 3.5

IE8

Answer 1

The line feed between the two <input> creates a space between. Just glue them. :)

Answer 2

I see they have a set height and width. Adding overflow: hidden should hide the whitespace outside of your defined width. That is an alternative to eliminating the whitespace, as @Pikrass noted. Usually the whitespace is a IE problem, I've not noticed it in FF before.

Answer 3

Try using a CSS reset - it may solve the browser discrepancy : http://meyerweb.com/eric/tools/css/reset/reset.css