用jquery输入数据时调整长度

当我试图用这段代码将数据输入A单元时,我想要输入的TD单元会被拉伸。我怎样才能防止这种情况,并保持它的正常大小呢? 如果您试图在表中的任何单元格中输入值,您将更好地理解我的意思。谢谢。

jFiddle示例: https://jsfiddle.net/cw3rojpz/

HTML:
<table>
<tr><td>5</td><td>5</td></tr>
<tr><td>2</td><td></td></tr>
<tr><td></td><td>5</td></tr>
</table>

jQuery:

$(function () {
    $("td").dblclick(function () {
        var OriginalContent = $(this).text();

        $(this).addClass("cellEditing");
        $(this).html("<input type='text' value='" + OriginalContent + "' />");
        $(this).children().first().focus();

        $(this).children().first().keypress(function (e) {
            if (e.which == 13) {
                var newContent = $(this).val();
                $(this).parent().text(newContent);
                $(this).parent().removeClass("cellEditing");
            }
        });

    $(this).children().first().blur(function(){
        $(this).parent().text(OriginalContent);
        $(this).parent().removeClass("cellEditing");
    });
    });
});

CSS:

table {
    font-size: 14px;
    border: 1px solid #8ab6d1; 
    font-family: Arial, Helvetica, sans-serif;
} 

table td {
    padding: 2px;
    margin: 1px;
    border: 1px solid #8ab6d1;
}