Tablet layout aligned offscreen left

Hello @wmea,

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

@media (max-width: 959px) {
    body.content-full-screen #wrap .entry .alignfull {
        margin-left: 0 !important;
    }
}

@media (max-width: 959px){
    body #wrap .entry-content .alignfull {
        margin-left: 0 !important;
    }
}

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).

I hope that helps.
Best Regards

Thanks @shahin – good try, but unfortunately some content is now aligned offscreen right (as opposed to left) on tablet. Any ideas on how to make it accurately fit screen width?

Hello @wmea,

I just fixed your CSS,
To solve the issue, you can choose one method:

Method 1: Add a custom CSS to that section, like this: https://postimg.cc/5jM913wf and update the CSS. Then update the CSS like this: https://postimg.cc/ZC8d4n9M.

@media (max-width: 959px) {
    body.content-full-screen #wrap .entry .alignfull.my-custom-class {
        margin-left: 0 !important;
    }
}

@media (max-width: 959px){
    body #wrap .entry-content .alignfull.my-custom-class {
        margin-left: 0 !important;
    }
}

Method 2: In this method, you need to a bit changing the structure of the section. you can add a container to the “alignfull” section and put the content into that container: https://postimg.cc/yk9ML4JK. You can add styles to the inner containers.

I hope it helps.
Best Regards

Hi Shahin @skalanter thank you for these suggestions and looking into this further.

Unfortunately the layout is still overflowing on the right of the page.

It appears the body of the entire website is wider than the header and footer. Do you have any further ideas?

• This reply was modified 1 year, 6 months ago by wmea.