SPPB Full Width Section For Articles And Sppb Modules Not Working As Expected - Question | JoomShaper
Back to the questions

SPPB Full Width Section For Articles And Sppb Modules Not Working As Expected

G

Graeme

SP Page Builder 11 months ago

Hi i have used this CSS by "Pavel" "SPPB Full Width Section for articles and sppb modules" on serveral site to get a full width section in article with no problems

I am tring to use elements from a layout bundle within an article and I am getting strange results The Section works perfectly in Page Builder Page https://www.hannahsulek.co.uk/small-heddle-bottle.html https://www.hannahsulek.co.uk/small-heddle-bottle.html

But in the article page it looks like this https://www.hannahsulek.co.uk/small-heddle-bottle-3.html https://www.hannahsulek.co.uk/small-heddle-bottle-3.html

i still have some css to tidy up but but the section itself is not displaying correcctly Can you help/

0
Website
https://www.hannahsulek.co.uk
3 Answers
Order by
Oldest Newest Votes
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 11 months ago #176717

Hello,

Thank you for your reply.

• Applicability of the Fix: The amendment should only be applied if you notice the same issue on other sites. It’s best to avoid adding unnecessary CSS if it’s not solving a current problem.

• Updating Breakpoints: It may be beneficial to update all your sites to the newer @media (min-width: 1400px) standard if it aligns with modern design practices and supports larger screen sizes. However, make sure to test thoroughly to avoid any unintended layout changes.

• Best Practices: It’s a good idea to adopt a modular and consistent approach to CSS. Updating breakpoints and applying solutions only when the issue arises will help keep your code clean and efficient across your sites.

Is there anything else that I can assist?

Best Regards,

0
Ziaul Kabir
Ziaul Kabir
Accepted Answer
Support Agent 11 months ago #176667

Hello Graeme,

Thank you for reaching out to us. This page section full width is not https://www.hannahsulek.co.uk/small-heddle-bottle-3.html work, due to a small css, Myabe it's comes form your template, You can fix it easily, use this css in your custom css:

.phm-mod-article-full-width-section .sppb-row-container, 
.phm-mod-article-full-width-section .sppb-container-inner {
        max-width: unset;
    }
}

To use custom css, check this guide: https://www.joomshaper.com/documentation/helix-framework/custom-code-css-js-meta

Thanks,

0
G
Graeme
Accepted Answer
11 months ago #176715

Hi Thanks for this it worked prfectly. I changed that code throughout the view points and it prevented the colour margin. Should i only use this amedement in this usecase or would it be appropriate to use in my other sites? mostly they are just a background image with centred content and this issue has not arissen previously.

I know there is the point if it is not broke dont fix it, but i have noted Pavels latest CSS code for this has updated the view point to @media (min-width: 1400px) Many my sites version starts with view point @media (min-width: 1140px) which is a little out of date so i would like to update these sites i would appreciate your insights.

Thank you

0