Hide rows or elements on different screen size

By editing a page builder row or a specific element you can use the "Extra class name" input field to hide those element on mobile or desktop for example.

First navigate to Appearance -> Customize -> Additional CSS and copy/paste the following CSS code:

@media (max-width: 991px) {
    .hide-mobile {
        display: none !important;
    }
}
@media (min-width: 992px) {
    .hide-desktop {
        display: none !important;
    }
}

Then edit the page where you want to hide an element, edit that element and use the "Extra class name" setting.

To hide an element on mobile you can enter "hide-mobile" as class name (visible in the screenshot below)

And to hide an element on desktop you can enter "hide-desktop" as class name.