jquery поиск нескольких карт с повторным размещением

Question

Я использую jquery для поиска страницы, которая содержит несколько bootstrap карточек. Код работает нормально:

<script>
$(document).ready(function () {
    jQuery.expr[':'].icontains = function (a, i, m) {
        return jQuery(a).text().toUpperCase()
            .indexOf(m[3].toUpperCase()) >= 0;
    };

    $('#txtSearch').keyup(function () {
        var text = $(this).val();
        // Hide all content class element
        $('.searchable').hide();
        // Search and show
        $('.searchable:icontains("' + text + '")').show();
    });
});

Однако найденные карты остаются в исходном положении, а те, которые соответствуют, показывают пустые места. Например, если в первом ряду 4 карты, а третья соответствует критериям, то будут скрыты первые две и последняя, ​​но третья остается в исходном положении. Как я могу переместить все найденные карты в линию, как будто других карт нет?

Answer 1

Я понял, почему. Это потому, что я использую строку с col-lg-4. Как только я удаляю строки и столбцы и просто использую карты, все работает. Но я должен определить фиксированную ширину, что хорошо.