Input text stretches with focus() event?

[codingisfun]

When I move cursor to first or last name, text stretches/moves up or down. Works fine If I remove focus. How do I fix it?

Thanks.

<table>
<td>First<input type=text name=fname value="Anna"></td>
<td>Last<input type=text name=Lname value="K"></td>
</table>


CSS:

input:focus {
border: 1px solid;
background: #cfc;
border-color: #090;
}

body {
font: 12px Arial, Verdana,Tahoma,Geneva, sans-serif;
margin:5px 0px 0px 0px;
}

[gil davis]

It is caused by the border. Place the same border around the default input with no color or same as background-color.

input {
border: 1px solid;
}
input:focus {
border: 1px solid;
background: #cfc;
border-color: #090;
}