Block inline

<div class="block-inline">
    <form action="" class="form block-inline-form">
        <div class="form-field form-field-search">
            <span class="form-field-search-icon"><i class="icon icon-search"></i></span>
            <input type="text" name="" class="form-input" placeholder="Search ..." />
        </div>

        <div class="form-field">
            <label for="filter-1" class="form-label">By option</label>
            <select name="" id="" class="form-select" id="filter-1">
                <option value="1">Option 1</option>
                <option value="2">Option 2</option>
                <option value="3">Option 3</option>
            </select>
        </div>

        <div class="form-field">
            <label for="filter-2" class="form-label">By option 2</label>
            <select name="" id="" class="form-select" id="filter-3">
                <option value="1">Option 1</option>
                <option value="2">Option 2</option>
                <option value="3">Option 3</option>
            </select>
        </div>

        <div class="form-field block-inline-v-center">
            <label class="form-checkbox-label">
                <input type="checkbox" class="form-check-input" />
                Show only active
            </label>
        </div>

        <div class="form-field form-switch block-inline-v-center">
            <label for="switch" class="form-switch-label">
                <input type="checkbox" name="switch" id="switch" class="form-switch-input" />
                <span class="form-switch-slider"></span>

                <span class="form-switch-slider-text">Published</span>
            </label>
        </div>

        <div class="block-inline-button-group">
            <button type="submit" class="button button-primary">Filter</button>
            <button type="reset" class="button button-outline">Reset</button>
        </div>
    </form>
</div>

Alternate

<div class="block-inline">
    <form action="" class="form block-inline-form">
        <div class="form-field form-field-search">
            <span class="form-field-search-icon"><i class="icon icon-search"></i></span>
            <input type="text" name="" class="form-input" placeholder="Search ..." />
        </div>

        <div class="form-field">
            <label for="filter-1" class="form-label">By option</label>
            <select name="" id="" class="form-select" id="filter-1">
                <option value="1">Option 1</option>
                <option value="2">Option 2</option>
                <option value="3">Option 3</option>
            </select>
        </div>

        <div class="form-field">
            <label for="filter-2" class="form-label">By option 2</label>
            <select name="" id="" class="form-select" id="filter-3">
                <option value="1">Option 1</option>
                <option value="2">Option 2</option>
                <option value="3">Option 3</option>
            </select>
        </div>

        <div class="block-inline-alt-section">
            <div class="form-field block-inline-v-center">
                <label class="form-checkbox-label">
                    <input type="checkbox" class="form-check-input" />
                    Show only active
                </label>
            </div>

            <div class="form-field form-switch block-inline-v-center">
                <label for="switch" class="form-switch-label">
                    <input type="checkbox" name="switch" id="switch" class="form-switch-input" />
                    <span class="form-switch-slider"></span>

                    <span class="form-switch-slider-text">Published</span>
                </label>
            </div>

            <div class="block-inline-button-group">
                <button type="submit" class="button button-primary">Filter</button>
                <button type="reset" class="button button-outline">Reset</button>
            </div>
        </div>
    </form>
</div>