• I want the page to be in %100 full width but i am having issues with paragraph display on mobile. The words dont fit inside the viewport.

    Is there a way to fix this? It makes no sense why this is happening.

    I want the paragraph to look good and fit nicely on a mobile and on a desktop. I need to keep the page in %100 full width.

    I have tried to put the paragraph inside a container and this does not solve the problem. I dont want to use CSS to get this done as i feel like ti should be a basic block implementation. This is very bazaar!!!

    The page I need help with: [log in to see the link]

Viewing 7 replies - 1 through 7 (of 7 total)
  • Hello @nichere,

    Thank you for reaching out,

    This appears to be a caching issue. I was unable to replicate the problem on my end.
    Please try to use the latest version of the theme and WordPress and etc, and then clear all level caches and cookies.

    If it didn’t help you, then the best way to solve it is with CSS, and CSS won’t cause problems on your site(all styling on the current website and adding new blocks or widgets all have CSS, and you cannot use CSS).

    If you don’t want to use CSS, you must not use paragraphs without padding left and right on full-width sections/columns.

    Both of these methods are completely standard and correct.
    You have the freedom to make a choice in any method.

    If you have chosen CSS way, please put the CSS below in Customizing > Custom CSS/JS > CSS Code:

    @media (max-width: 780px) {
        /* remove extra margins on mobile and tablet */
        body.content-full-screen .entry-content .alignfull {
            margin-left: 0% !important;
            width: 100% !important;
            max-width: 100% !important;
        }
    
        /* Padding left and right for paragraph */
        body.content-full-screen .entry-content .alignfull p {
            padding: 0 20px;
        }
    }

    Result: https://postimg.cc/G8rh3pmf.

    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

    Thread Starter nichere

    (@nichere)

    Thank you for you help with this. what is the path to clear all level caches and cookies.?

    clear all level caches and cookies.

    Thread Starter nichere

    (@nichere)

    what i had to do to get the display correct in blokcs is to centre align the paragraphs. Which is, in my opinion, unaccaptable. Previous to this i pressed page cache, but that didnt change anything. Now I am left with centre aligned ugly paragraphs.

    I want to use %100 full width because that makse each block stack without any gap. But i want to be able to insert paragraphs without losing them out of the view port in mobile.

    I want to just use blocks. I dont like overly comlicating things.

    What else do you suggest i do? Thank you

    this is set to ‘wide width’ but i get this white seperation line, which i dont like (but the paragraph is fixed)

    %100 wide width, there is no white seperation gap.

    Thread Starter nichere

    (@nichere)

    IS there a problem with the OceanWP theme? look at that heading?!

    now updating theme

    no difference at all

    Hello @nichere,

    The issues you’ve mentioned are due to how the website is built. You should have created different styles for responsive devices, such as smaller font sizes.
    When I checked the site just now, the issue you described is no longer there. It’s possible that they were caused by a cache. Please check these screenshots: https://postimg.cc/gallery/cW3Ym3Z.

    After clearing caches, you can use hard-refreshing keys and recheck the issue. To refresh the page, please follow the steps explained in these links:
    https://www.documate.org/automation/what-is-a-hard-refresh-how-to-do-a-hard-refresh-in-any-browser/
    https://www.usmobile.com/blog/how-to-do-a-hard-refresh-on-your-browser/
    Also, to clear cookies, use this icon: https://postimg.cc/0rtp7SS9.

    You’re using a powerful caching system, and I can see all the styles come from cached files. Also, remember that you should check the site with a delay because the caches may not be cleared immediately.

    Also, please note that you can edit your first reply instead of sending multiple replies. This will help keep the conversation organized and easy to follow. Thank you.

    I hope it helps.
    Best Regards

    • This reply was modified 1 year, 2 months ago by Shahin.
    Thread Starter nichere

    (@nichere)

    ok thank you

    Yes, I saw that the font size was customised for this paticulor page, so i set it back to default. Also, though the page is set to %100 page width, I placed the content into a container and set that to wide width. This helped keep the paragraph and headings inside the viewport of mobile, but…I still cannot add padding to the paragraph to make it sit in from the edge.

    Hello @nichere,

    If you can’t see padding options in paragraph block kindly add the code below to the child theme on your website:

    function oceanwp_theme_supports_custom_spacing(){
    	add_theme_support('appearance-tools');
    	add_theme_support('custom-spacing');
    }
    add_action('after_setup_theme','oceanwp_theme_supports_custom_spacing');

    Then you’ll see the padding: https://postimg.cc/MXt9bfrb.
    Download child theme: https://docs.oceanwp.org/article/90-sample-child-theme.

    Best Regards

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Paragraph width in 0 full width page’ is closed to new replies.