Fieldset Top Border breaks after Changing background of input field present in it: Only in IE11

I am facing an issue with fieldset top border in IE 11.

Description: I am having a fieldset in my web page. Its legend tag contains a checkbox. And its sub elements are input text fields. I have a JS which changes background color of input fields on checking/Unchecking checkbox present in legend.

Problem: When background color of input field changes, Fieldset's top border breaks

Can anyone tell me why this is happening?

Sample Code:

css:

table .td-left
{
    width: 60%;
    text-align:left; 
}


table .td-right
{
    width: 40%;
    text-align:right; 
}

JS:

function changeBackground()
{ document.getElementById("changeit").style.backgroundCol 

or = "red"; } html:

<fieldset>
    <legend>
        <input type = "checkbox" onclick = 
"changeBackground()">
        <label>Hello</label>
    </legend>
   <table>
        <tr>
            <td class = "td-right">
                <label>Enter Text Here:</label>
            </td>
            <td class = "td-left">
                <input type = "text" id = "changeit">
            </td>
        </tr>
    </table>
</fieldset>