.alignfull Full Width Gap on Mobile

Hello @skinbience ,

Thank you for using Neve and for reaching out!

I am not familiar with this plugin you are using however, you can fix CSS and target it more properly by selecting the correct classes. I have accessed your website now and it seems like you decided to go with full width for the entire website, desktop, and mobile. It seems like this plugin is constructing everything under the same parent classes thus you need to pinpoint them exactly with CSS.

For example, to target the first column “benefits”, you need to target it with this code:

@media only screen and (max-width: 600px){
.wp-block-stackable-column.stk-block-column.stk-column.stk-block.stk-7b2f627.stk-block-background {
    padding: 0px !important; 
}}

You can use any instruction you desire and it will only affect the Benefits Column on mobile.

To target the rest of the elements you are interested in, you can use the Google Inspector Tool to select the desired element, then hit the plus sign to add a new style rule, and the proper classes should appear. (screenshot)

Thank you and have an amazing day!

Hi @mateithemeisle

Sorry for the delay – happy new years and all that. ??

I really appreciate your help – and your suggestions will help me in the future. With that said, are you certain this is a Stackable issue?

I only ask because, I seem to get this 7.5px padding on ALL full-width blocks on mobile, even with default wordpress blocks. I have created an example page for you to see here:
https://skinbience.com.au/nevetest/

On this page is simply a wordpress image block, set to full-width, and it looks as expected on desktop, but has 7.5px padding on either side on mobile.

You can see this exact same behaviour on our homepage at https://www.skinbience.com.au – the full-width hero/carousel (using the ‘gutenslider’ plugin) at the top of the page looks great on desktop, but also has 7.5px padding on mobile.

It seems that Neve’s full-width container just has 7.5px padding on mobile?
Please understand I am still learning/teaching myself and may just be confused, but my understanding was that full-width blocks/content should be aligned to edges of the screen, without padding/margins?

I am looking to purchase Neve PRO ASAP, but I really need to wrap my head around what’s going on here before I can move forward and do so.

Thanks so much for your help thus far.

Please note that since I have created this test page for you to look at, I have mostly fixed the issue by adding this CSS:

.alignfull{padding:0 0!important;}

So I guess my main question now is, is it intentional or expected behaviour that Neve puts 7.5px left/right padding on anything that’s set to align full-width?

Hi @skinbience!

We’re glad to hear this is solved now! This is the desired behavior of the theme and it can be overwritten using some CSS to set the padding to 0, as you mentioned. It would be great if you could mark this thread as resolved.

Thank you and have a nice day!