Remove the mobile border on the Separate Layout style?

Hello @phoenixblue,

Thank you for reaching out,

Actually, that’s not a border, it follows the styling from the desktop, you can change it with some custom CSS.

Please put the CSS below in Customizing > Custom CSS/JS > CSS Code:

@media only screen and (max-width: 959px) {
    #main #content-wrap.container {
        max-width: 100% !important;
        margin: 0;
    }

    body.separate-blog.separate-layout #blog-entries>* {
        margin-bottom: 0;
    }
}

If you want to remove gaps, so you can keep the following part, if you don’t need that, then remove it from the CSS above: https://postimg.cc/NKGw6cZP

Please read this link for more information about the CSS/JS code on the customizer: https://docs.oceanwp.org/article/354-add-custom-css-and-js-to-your-website.

Note: If you have any cache plugin or server cache(CDN / Browser Cache and Cookies and …), you need to clear its cache contents or disable them to see your changes. Also, remember to click on the regenerate all assets file and data in Elementor > Tools(if you have Elementor).

You can learn how to use Chrome Developer Tools or Firefox Developer Tools to help you see and test changes to your CSS:
https://developers.google.com/web/tools/chrome-devtools/
https://developer.mozilla.org/en-US/docs/Tools
CSS Tutorial: https://www.w3schools.com/css/
For more information about media queries, please read this article:
https://www.w3schools.com/css/css_rwd_mediaqueries.asp

I hope it helps.
Best Regards

Thank you. The CSS code worked perfectly. 🙂

I didn’t notice the blog section had those separations too on mobile, so that was also helpful.