输入和输入周围的间距选择

Question

为什么在我无法删除的输入下有额外的间距？

http://jsfiddle.net/maciek/guY7P/1/

HTML

 <table style="width:100px;">
    <tr>
        <td width="75%">
            <input value="INPUT1">
        </td>
        <td width="25%">
            <select>
                <option value="METRE">METRE</option>
                <option value="FOOT">FOOT</option>
            </select>
        </td>
    </tr>
    <tr>
        <td width="75%">
            <input value="INPUT1">
        </td>
        <td width="25%">
            <select>
                <option value="METRE">METRE</option>
                <option value="FOOT">FOOT</option>
            </select>
        </td>
    </tr>
    <tr>
        <td width="75%">
            <input value="INPUT1">
        </td>
        <td width="25%">
            <input value="INPUT1">
        </td>
    </tr>
    <tr>
        <td width="75%">
            <input value="INPUT1">
        </td>
        <td width="25%">
            <input value="INPUT1">
        </td>
    </tr>
</table>

CSS

table, tr, td {
    border-collapse:collapse;
    border-spacing:0;
    padding:0;
    margin:0;
}
input, select {
    background:#000;
    border:0;
    margin:0px;
}

Answer 1

将height:100%添加到输入规则中，以便元素占据单元格的整个高度。

input, select {
    background:#000;
    border:0;
    margin:0px;
    height:100%;
}

<强> jsFiddle example

Answer 2

我希望尝试使用div更好，而不是在表格中