input in table > td, But yet extra bottom spacing between rows! Internet Explorer
- by phpExe
Im using meyer css reset. But I have problem with input in a table. There in extra space between rows:
<table class="table" cellpadding="0" cellspacing="0" border="0">
<tr>
<td> </td>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
<td>8</td>
<td>9</td>
<td>10</td>
</tr>
<tr>
<td>1</td>
<td><input type="text"/></td>
<td><input type="text"/></td>
<td><input type="text"/></td>
<td><input type="text"/></td>
<td><input type="text"/></td>
<td><input type="text"/></td>
<td><input type="text" class="black"/></td>
<td><input type="text"/></td>
<td><input type="text"/></td>
<td><input type="text"/></td>
</tr>
<tr>
<td>2</td>
<td><input type="text" /></td>
<td><input type="text"/></td>
<td><input type="text"/></td>
<td><input type="text"/></td>
<td><input type="text"/></td>
<td><input type="text"/></td>
<td><input type="text"/></td>
<td><input type="text" class="black"/></td>
<td><input type="text"/></td>
<td><input type="text"/></td>
</tr>
</table>
and css:
.table {
border-collapse: collapse;
border-spacing: 0px;
}
.table tr {
margin-bottom:0;
overflow:hidden;
height:25px;
width: 100%;
padding:0;
}
.table input {
width:25px;
height:25px;
border:1px solid #000;
text-align:center;
}
.black {
background:#000;
}
Why there is extra bottom spacing in internet explorer (I hate ie :(()?
Thanks alot
