Mobile Responsive Setup

[dark_apostles]

Hi there,

Is there a way that I can change the padding on mobile/table devices that it doesn’t affect my desktop?

Currently my desktop website looks fine but when it is on smaller devices, tablet/mobile phone, all the padding and spacing is off.

Digital Leadership Transformation Services to Help You Inspire Change

Thanks,

[nabeel]

Hi @jonopoon,

Thank you for reaching out to us. Currently there are no responsive options to set padding/margins in different devices, you’ll need to do this with custom CSS, while that is outside the scope of support, I could point you in the right direction with the understanding that it would ultimately be your responsibility to take it from here.

You can achieve this using CSS media queries, here are some relevant threads that you can follow as a starting point Change Section Padding On Mobile and Decrease padding margin on small screens

Here are some related links for further reading, this could help you in finding and implementing some CSS fixes:

• Intro to CSS - https://goo.gl/mFuWQT
• How to get CSS selectors - https://goo.gl/BmoH39
• Get Started With Viewing And Changing CSS - https://goo.gl/7xFhDa
• CSS Media Queries - https://goo.gl/L3ZHNg

Hope this helps!

[dark_apostles]

That’s such a shame that there is no option for different device setting and margin setup.

[dark_apostles]

Also, I’ve noticed a massive gap underneath my revolution slider - I’ve set up all the settings for responsive but can’t see to remove that gap on my homepage video slider?

[prakash_s]

Hello @jonopoon

Regretfully, there is no option to set a margin for different devices but you can use viewport(VW) unit to set margin it will be work for each device. Please have look at this article https://css-tricks.com/fun-viewport-units/

For the slider
You set height for the slider for different screens size. Go to Revolution Slider --->Edit slider--->Layout for here you can set the height of the slider

Screenshot

Thanks