diff --git a/src/opnsense/mvc/app/views/OPNsense/Firewall/filter_rule.volt b/src/opnsense/mvc/app/views/OPNsense/Firewall/filter_rule.volt
index c950ef2f6..6b2c2f5d6 100644
--- a/src/opnsense/mvc/app/views/OPNsense/Firewall/filter_rule.volt
+++ b/src/opnsense/mvc/app/views/OPNsense/Firewall/filter_rule.volt
@@ -66,7 +66,6 @@
             del:'/api/firewall/filter/del_rule/',
             toggle:'/api/firewall/filter/toggle_rule/',
             options: {
-                resizableColumns: true,
                 triggerEditFor: getUrlHash('edit'),
                 initialSearchPhrase: getUrlHash('search'),
                 rowCount: [20,50,100,200,500,1000],
diff --git a/src/opnsense/www/css/jquery.bootgrid.css b/src/opnsense/www/css/jquery.bootgrid.css
index 89b08c575..73f846f36 100644
--- a/src/opnsense/www/css/jquery.bootgrid.css
+++ b/src/opnsense/www/css/jquery.bootgrid.css
@@ -74,8 +74,7 @@
   cursor: not-allowed;
 }
 .bootgrid-table {
-  table-layout: auto;
-  border-collapse: separate;
+  table-layout: fixed;
 }
 .bootgrid-table a {
   outline: 0;
@@ -166,33 +165,3 @@
   text-overflow: inherit !important;
   white-space: inherit !important;
 }
-.bootgrid-rc-container {
-    position: relative;
-    overflow: none;
-}
-.bootgrid-rc-handle {
-    position: absolute;
-    width: 7px;
-    cursor: ew-resize;
-    margin-left: -3px;
-    z-index: 2;
-}
-table.bootgrid-rc-resizing {
-    cursor: ew-resize;
-}
-.bootgrid-rc-handle::before {
-    content: "";
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 50%;
-    width: 1px;
-    transform: translateX(-50%);
-}
-.highlight,
-.highlight-move {
-    border-right: 1px solid rgba(128, 128, 128, 1);
-}
-.no-hover * {
-    pointer-events: none;
-}
diff --git a/src/opnsense/www/js/jquery.bootgrid.js b/src/opnsense/www/js/jquery.bootgrid.js
index f41639a5d..c018c6268 100644
--- a/src/opnsense/www/js/jquery.bootgrid.js
+++ b/src/opnsense/www/js/jquery.bootgrid.js
@@ -84,7 +84,6 @@ function init()
     renderTableHeader.call(this);
     renderSearchField.call(this);
     renderActions.call(this);
-    initializeResizableColumns.call(this);
     loadData.call(this);
 
     this.element.trigger("initialized" + namespace);
@@ -141,11 +140,9 @@ function loadColumns()
                 setStaged: false,
                 unsetStaged: false,
                 width: ($.isNumeric(data.width)) ? data.width + "px" :
-                    (typeof(data.width) === "string") ? data.width : null,
-                calculatedWidth: null
+                    (typeof(data.width) === "string") ? data.width : null
             };
         that.columns.push(column);
-        that.columnMap.set(column.id, column);
         if (column.order != null)
         {
             that.sortDictionary[column.id] = column.order;
@@ -208,15 +205,9 @@ function update(rows, total)
     if (shouldRenderHeader) {
         /* multiple columns have been set/unset prior to this reload */
         renderTableHeader.call(that);
-        resetHandleOverlay.call(that);
     }
 
     renderRows.call(that, rows);
-
-    window.setTimeout(function () {
-        syncHandlePositions.call(that);
-    }, 10);
-
     renderInfos.call(that);
     renderPagination.call(that);
 
@@ -281,6 +272,7 @@ function loadData(soft=false)
                 that.current = response.current;
                 that.cachedResponse = response;
                 update.call(that, response.rows, response.total);
+                this.noResultsRendered = false;
             },
             error: function (jqXHR, textStatus, errorThrown)
             {
@@ -422,7 +414,6 @@ function renderActions()
                     e.stopPropagation();
                     Object.keys(localStorage)
                         .filter(key =>
-                            key.startsWith(`columnSizes[${that.uid}`) ||
                             key.startsWith(`visibleColumns[${that.uid}`) ||
                             key.startsWith(`rowCount[${that.uid}`) ||
                             key.startsWith(`sortColumns[${that.uid}`)
@@ -467,12 +458,12 @@ function renderColumnSelection(actions)
                             if (!checkbox.prop("disabled"))
                             {
                                 column.visible = localStorage.getItem('visibleColumns[' + that.uid + '][' + column.id + ']') === 'true';
-                                column.visible ? column.setStaged = true : column.unsetStaged = true;
                                 var enable = that.columns.where(isVisible).length > 1;
                                 $this.parents(itemsSelector).find(selector + ":has(" + checkboxSelector + ":checked)")
                                     ._bgEnableAria(enable).find(checkboxSelector)._bgEnableField(enable);
 
                                 that.element.find("tbody").empty(); // Fixes an column visualization bug
+                                renderTableHeader.call(that);
                                 that.columnSelectForceReload ? loadData.call(that)
                                                              : update.call(that, that.cachedResponse.rows, that.cachedResponse.total);
                             }
@@ -1047,304 +1038,8 @@ function sortRows()
             this.rows.sort(sort);
         }
     }
-}
-
-// RESIZABLE COLUMN INTERNAL FUNCTIONS
-// ====================
-
-function initializeResizableColumns() {
-    if (!this.options.resizableColumns) {
-        return;
     }
 
-    resetHandleOverlay.call(this);
-
-    syncHandlePositions.call(this);
-
-    bindEvents($(window), ['resize'], null, syncHandlePositions.bind(this));
-}
-
-function resetHandleOverlay() {
-    let that = this;
-
-    if (!this.options.resizableColumns) {
-        return;
-    }
-
-    if (!this.columns.length) {
-        return;
-    }
-
-    this.$tableHeaders = this.element.find(`tr:first > th:visible${this.options.rowSelect ? ':gt(0)' : ''}`);
-
-    // annotate initial column width
-    this.$tableHeaders.each(function (i, el) {
-        let $el = $(el);
-        let col = that.columnMap.get($el.data('column-id'));
-        let pxWidth = 0;
-
-        if (!col || col.width == null) {
-            pxWidth = $el.outerWidth();
-        } else {
-            pxWidth = toPixels(col.width);
-            $el.data('minWidth', pxWidth);
-        }
-
-        if (col) {
-            let stored = localStorage.getItem(`columnSizes[${that.uid}][${col.id}]`);
-            if (stored != null) {
-                setWidth.call(that, el, parseFloat(stored));
-            } else if (col.calculatedWidth != null) {
-                setWidth.call(that, el, col.calculatedWidth);
-            } else {
-                setWidth.call(that, el, pxWidth);
-            }
-        }
-    });
-
-    // setup handle container overlay
-    if (this.$resizableHandleContainer != null) {
-        this.$resizableHandleContainer.remove();
-    }
-
-    this.$resizableHandleContainer = $(`<div class="bootgrid-rc-container"/>`);
-    this.element.before(this.$resizableHandleContainer);
-
-    this.$tableHeaders.each(function (i, el) {
-        let $current = that.$tableHeaders.eq(i);
-        let $next = that.$tableHeaders.eq(i + 1);
-
-        if ($next.length === 0 || $current.is('[data-noresize]') || $next.is('[data-noresize]')) {
-            return;
-        }
-
-        $(`<div class="bootgrid-rc-handle"/>`).data('th', $(el)).data('id', $(el).data('column-id'))
-            .hover(
-                function() {
-                    $(el).addClass('highlight');
-                    that.element.find('tr').map(function() {
-                        $(this).find('td').eq($(el).index()).addClass('highlight');
-                    });
-                },
-                function() {
-                    $(el).removeClass('highlight');
-                    that.element.find('tr').map(function() {
-                        $(this).find('td').eq($(el).index()).removeClass('highlight');
-                    });
-                }
-            )
-            .appendTo(that.$resizableHandleContainer);
-    });
-
-    bindEvents(
-        this.$resizableHandleContainer,
-        ['mousedown', 'touchstart'],
-        '.bootgrid-rc-handle',
-        onMouseDown.bind(this)
-    );
-}
-
-function syncHandlePositions() {
-    let that = this;
-
-    if (!this.options.resizableColumns) {
-        return;
-    }
-
-    // sync handle container to table width
-    this.$resizableHandleContainer.width(this.element.width());
-
-    // sync individual handles
-    this.$resizableHandleContainer.find('.bootgrid-rc-handle').each(function (i, el) {
-        let $el = $(el);
-        let $originalHeader = $el.data('th');
-
-        var left = $originalHeader.outerWidth() + ($originalHeader.offset().left - that.$resizableHandleContainer.offset().left);
-        $el.css({ left: left, height: that.element.find('thead').height() })
-    });
-}
-
-function onMouseDown(event) {
-    let $currentHandle = $(event.currentTarget);
-    let idx = $currentHandle.index();
-    let $leftCol = this.$tableHeaders.eq(idx).not('[data-noresize]');
-    let leftCol = this.columnMap.get($leftCol.data('column-id'));
-    let $rightCol = this.$tableHeaders.eq(idx + 1).not('[data-noresize]');
-    let rightCol = this.columnMap.get($rightCol.data('column-id'));
-
-    if ($currentHandle.is('[data-noresize]') || !leftCol || !rightCol) {
-        return;
-    }
-
-    let leftColWidth = leftCol.calculatedWidth;
-    let rightColWidth = rightCol.calculatedWidth;
-
-    if (this.resizeOp) {
-        onMouseUp.call(this, event);
-    }
-
-    // start operation
-    this.resizeOp = {
-        $leftCol: $leftCol,
-        $rightCol: $rightCol,
-        $currentHandle, $currentHandle,
-
-        startX: getPointerX(event),
-
-        widths: {
-            left: leftColWidth,
-            right: rightColWidth
-        },
-        newWidths: {
-            left: leftColWidth,
-            right: rightColWidth
-        }
-    }
-
-    bindEvents(
-        $(this.element[0].ownerDocument),
-        ['mousemove', 'touchmove'],
-        null,
-        onMouseMove.bind(this)
-    );
-
-    bindEvents(
-        $(this.element[0].ownerDocument),
-        ['mouseup', 'touchend'],
-        null,
-        onMouseUp.bind(this)
-    );
-
-    this.$resizableHandleContainer.add(this.element).addClass('bootgrid-rc-resizing');
-    $leftCol.add($rightCol).addClass('bootgrid-rc-resizing');
-
-    $leftCol.addClass('highlight-move');
-    this.element.find('tr').map(function() {
-        let i = $currentHandle.data('th').index();
-        $(this).find('td').eq(i).addClass('highlight-move');
-    });
-
-    // prevent global hover effects when resizing
-    $('body').addClass('no-hover');
-    event.preventDefault();
-}
-
-function onMouseMove(event) {
-    let op = this.resizeOp
-    if (!this.resizeOp) {
-        return;
-    }
-
-    let diff = (getPointerX(event) - op.startX)
-    if (diff === 0) {
-        return;
-    }
-
-    let leftCol = op.$leftCol[0];
-    let rightCol = op.$rightCol[0];
-    let widthLeft = undefined;
-    let widthRight = undefined;
-
-    if (diff > 0) {
-        widthLeft = constrainWidth.call(this, op.widths.left + (op.widths.right - op.newWidths.right), op.$leftCol);
-        widthRight = constrainWidth.call(this, op.widths.right - diff, op.$rightCol);
-    } else if (diff < 0) {
-        widthLeft = constrainWidth.call(this, op.widths.left + diff, op.$leftCol);
-        widthRight = constrainWidth.call(this, op.widths.right + (op.widths.left - op.newWidths.left), op.$rightCol);
-    }
-
-    if (leftCol && widthRight >= 0) {
-        setWidth.call(this, leftCol, widthLeft);
-    }
-    if (rightCol && widthLeft >= 0) {
-        setWidth.call(this, rightCol, widthRight);
-    }
-
-    op.newWidths.left = widthLeft;
-    op.newWidths.right = widthRight;
-}
-
-function onMouseUp(event) {
-    let that = this;
-    let idx = this.resizeOp.$currentHandle.index();
-
-    if (!this.resizeOp) {
-        return;
-    }
-
-    unbindEvents($(this.element[0].ownerDocument), ['mouseup', 'touchend', 'mousemove', 'touchmove']);
-
-    this.$resizableHandleContainer.add(this.element).removeClass('bootgrid-rc-resizing');
-
-    this.resizeOp.$leftCol.add(this.resizeOp.$rightCol).add(this.resizeOp.$currentHandle).removeClass('bootgrid-rc-resizing');
-
-    this.resizeOp.$leftCol.removeClass('highlight-move');
-    this.element.find('tr').map(function() {
-        let i = that.resizeOp.$currentHandle.data('th').index();
-        $(this).find('td').eq(i).removeClass('highlight-move');
-    });
-    $('body').removeClass('no-hover');
-
-    this.columns.where(isVisible).forEach(function(col) {
-        localStorage.setItem(`columnSizes[${that.uid}][${col.id}]`, col.calculatedWidth);
-    })
-
-    syncHandlePositions.call(this);
-
-    this.resizeOp = null;
-}
-
-function bindEvents($target, events, data, callback) {
-    events = events.join(namespace + ' ') + namespace;
-    $target.on(events, data, callback);
-}
-
-function unbindEvents($target, events) {
-    events = events.join(namespace + ' ') + namespace;
-    $target.off(events);
-}
-
-function getPointerX(event) {
-    if (event.type.indexOf('touch') === 0) {
-        return (event.originalEvent.touches[0] || event.originalEvent.changedTouches[0]).pageX;
-    }
-    return event.pageX;
-}
-
-function constrainWidth(width, $el) {
-    let options = this.options.resizableColumnSettings;
-    let min = $el.data('minWidth');
-
-    if (options.minWidth != undefined) {
-        width = Math.max(options.minWidth, width);
-    }
-
-    if (min != undefined) {
-        width = Math.max(min, width);
-    }
-
-    if (options.maxWidth != undefined) {
-        width = Math.min(options.maxWidth, width);
-    }
-    return width;
-}
-
-function setWidth(element, width) {
-    let col = this.columnMap.get($(element).data('column-id'));
-    width = width > 0 ? width : 0;
-    element.style.width = width + 'px';
-    col.calculatedWidth = width;
-}
-
-function toPixels(value) {
-    const tempElement = document.createElement("div");
-    tempElement.style.width = value;
-    document.body.appendChild(tempElement);
-    const pixels = window.getComputedStyle(tempElement).width;
-    document.body.removeChild(tempElement);
-    return parseFloat(pixels);
-}
-
 // GRID PUBLIC CLASS DEFINITION
 // ====================
 
@@ -1365,7 +1060,6 @@ var Grid = function(element, options)
     // overrides rowCount explicitly because deep copy ($.extend) leads to strange behaviour
     var rowCount = this.options.rowCount = this.element.data().rowCount || options.rowCount || this.options.rowCount;
     this.columns = [];
-    this.columnMap = new Map();
     this.current = 1;
     this.currentRows = [];
     this.identifier = null; // The first column ID that is marked as identifier
@@ -1394,10 +1088,6 @@ var Grid = function(element, options)
     this.xqr = null;
     this.uid = window.location.pathname + "#" + this.element.attr('id');
 
-    this.$tableHeaders = [];
-    this.$resizableHandleContainer = null;
-    this.resizeOp = null;
-
     // todo: implement cache
 };
 
@@ -1535,13 +1225,6 @@ Grid.defaults = {
         method: "POST"
     },
 
-    resizableColumns: false,
-
-    resizableColumnSettings: {
-        minWidth: 50,
-        maxWidth: null
-    },
-
     /**
      * Enriches the request object with additional properties. Either a `PlainObject` or a `Function`
      * that returns a `PlainObject` can be passed. Default value is `{}`.
@@ -1834,7 +1517,7 @@ Grid.defaults = {
         actionDropDownCheckboxItem: "<li><label class=\"{{css.dropDownItem}}\"><input id=\"{{ctx.id}}\" name=\"{{ctx.name}}\" type=\"checkbox\" value=\"1\" class=\"{{css.dropDownItemCheckbox}}\" {{ctx.checked}} /> {{ctx.label}}</label></li>",
         actions: "<div class=\"{{css.actions}}\"></div>",
         body: "<tbody></tbody>",
-        cell: "<td class=\"bootgrid-rc-column {{ctx.css}}\" style=\"{{ctx.style}}\">{{ctx.content}}</td>",
+        cell: "<td class=\"{{ctx.css}}\" style=\"{{ctx.style}}\">{{ctx.content}}</td>",
         footer: "<div id=\"{{ctx.id}}\" class=\"{{css.footer}}\"><div class=\"row\"><div class=\"col-sm-6\"><p class=\"{{css.pagination}}\"></p></div><div class=\"col-sm-6 infoBar\"><p class=\"{{css.infos}}\"></p></div></div></div>",
         header: "<div id=\"{{ctx.id}}\" class=\"{{css.header}}\"><div class=\"row\"><div class=\"col-sm-12 actionBar\"><p class=\"{{css.search}}\"></p><p class=\"{{css.actions}}\"></p></div></div></div>",
         headerCell: "<th data-column-id=\"{{ctx.column.id}}\" class=\"{{ctx.css}}\" style=\"{{ctx.style}}\"><a href=\"javascript:void(0);\" class=\"{{css.columnHeaderAnchor}} {{ctx.sortable}}\"><span class=\"{{css.columnHeaderText}}\">{{ctx.column.headerText}}</span>{{ctx.icon}}</a></th>",
diff --git a/src/opnsense/www/themes/opnsense-dark/build/css/jquery.bootgrid.css b/src/opnsense/www/themes/opnsense-dark/build/css/jquery.bootgrid.css
index e8e8ede4d..3a2fd5917 100644
--- a/src/opnsense/www/themes/opnsense-dark/build/css/jquery.bootgrid.css
+++ b/src/opnsense/www/themes/opnsense-dark/build/css/jquery.bootgrid.css
@@ -73,8 +73,7 @@
   cursor: not-allowed;
 }
 .bootgrid-table {
-  table-layout: auto;
-  border-collapse: separate;
+  table-layout: fixed;
 }
 .bootgrid-table a {
   outline: 0;
@@ -164,33 +163,3 @@
   text-overflow: inherit !important;
   white-space: inherit !important;
 }
-.bootgrid-rc-container {
-    position: relative;
-    overflow: none;
-}
-.bootgrid-rc-handle {
-    position: absolute;
-    width: 7px;
-    cursor: ew-resize;
-    margin-left: -3px;
-    z-index: 2;
-}
-table.bootgrid-rc-resizing {
-    cursor: ew-resize;
-}
-.bootgrid-rc-handle::before {
-    content: "";
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 50%;
-    width: 1px;
-    transform: translateX(-50%);
-}
-.highlight,
-.highlight-move {
-    border-right: 1px solid rgba(128, 128, 128, 1);
-}
-.no-hover * {
-    pointer-events: none;
-}