Column widths widen depending on search

I have certain columns that have only an icon to allow users to click and download files. These columns are defined as %1 width as shown below.

{
                                data: 'FIG',
                                orderable: false,
                                targets: 5,
                                width: '1%',
                                "searchable": false,
                                createdCell: function (td, cellData, rowData, row, col) {
                                    $.getFIGColumnHTML(rowData, td)
                                }
                            },

Here is the function that is called to format the HTML:

            jQuery.getFIGColumnHTML = function (rowData, td) {
                var result;

                if ((rowData.FIG !== undefined) & (rowData.FIG !== null)) {
                    if (rowData.FIG !== '00000000-0000-0000-0000-000000000000') {
                        $(td).html('<img class="FIGLink" src="/content/images/FIG_pdf.gif">');
                    }
                    else {
                        $(td).html('<img src="../content/images/fig_pdf_off.gif" alt="FIG">');
                    }
                }
            }

I execute searches and the width works as defined. I then do a search returning a larger # of results and the width of that specific column widens. I'm not sure if the larger result set has anything to do with the issue. The css below shows up as inline in the debugger. The first example is the HTML with the correct width. The second example is the HTML with the incorrect width.

Thanks in advance for any ideas.

Tom

<th class="sorting_disabled" tabindex="0" aria-controls="grid" rowspan="1" colspan="1" style="width: 27px;" aria-label="FIG">FIG</th>

element {
    width: 27px;
}

<th class="sorting_disabled" tabindex="0" aria-controls="grid" rowspan="1" colspan="1" style="width: 299px;" aria-label="FIG">FIG</th>

element {
    width: 299px;
}