Hi! Hoping you can help with this. I am having trouble getting a Revolution Slider to fill the screen on mobile (and desktop) viewports. I have the same issue on Android and iPhone. The slider is "full screen" but in the theme, it shows white borders at the top and bottom. I tried dozens of combinations of settings in the slider, in the row container, in the CSS, and ultimately the only thing that made a difference was changing the margins to -58px at the top and that slides it up, but doesn't help the margin at the bottom (on mobile only), and really it's just getting out-of-whack to more I trial-and-error this. I need you guys! :-)
If I just give the row container a background image, that fills the background without borders and works on all devices, but if I try to do a full screen revolution slider instead, it doesn't work.
Hi Gregor! Thanks for getting back to me! I really need this. I am definitely interested in using the CSS option. I see you have the column setting option in the Selection_617.png image, but the CSS option images do not show anything (the other 2 files). Can you please take those two screen shots again and repost? This is just what I need! THANK YOU!
Thanks, Gregor. That indeed is the right place in the CSS. I can replicate it by using Inspector in FireFox. See before and after screenshots. However, when I enter the override CSS in the them options as you show below, it does not work. it is not overriding the default CSS.
Hi! Hoping you can help with this. I am having trouble getting a Revolution Slider to fill the screen on mobile (and desktop) viewports. I have the same issue on Android and iPhone. The slider is "full screen" but in the theme, it shows white borders at the top and bottom. I tried dozens of combinations of settings in the slider, in the row container, in the CSS, and ultimately the only thing that made a difference was changing the margins to -58px at the top and that slides it up, but doesn't help the margin at the bottom (on mobile only), and really it's just getting out-of-whack to more I trial-and-error this. I need you guys! :-)
If I just give the row container a background image, that fills the background without borders and works on all devices, but if I try to do a full screen revolution slider instead, it doesn't work.
Is there a custom CSS workaround?
Hi,
In order to remove paddings, you need to set padding and magrin 0 in the row or column settings, or you can remove it for all the page via CSS.
Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list.
Regards, Oliver
Hi Gregor! Thanks for getting back to me! I really need this. I am definitely interested in using the CSS option. I see you have the column setting option in the Selection_617.png image, but the CSS option images do not show anything (the other 2 files). Can you please take those two screen shots again and repost? This is just what I need! THANK YOU!
Mark
Hi,
Pls. give me link to the page and add screenshot, where you need to remove padding.
Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list.
Regards, Oliver
Thanks, Gregor. Here is the link...
www.saltwatercolours.com/awesome
Attached are the screenshots on iPhone, Android, and desktop.
pls. use following css:
body .vc_row.vc_row-o-content-top>.vc_column_container>.vc_column-inner { padding-top: 0; }Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list.
Regards, Oliver
Gregor, I just made a short video to explain what happens. This may be helpful. Please have a look here:
Thank you for posting that CSS for the page, but it did not work. Hopefully the video will shed some light on the issue! thanks!
... and one more thing, I have this 2nd video which digs into the styles.. maybe that will help too. Thanks!
2nd video: https://youtu.be/8fY14ZV-4ss
Hi,
pls. give me link to this page.
Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list.
Regards, Oliver
Thanks, Gregor. The link to the page I am using as a test to isolate the issue is...
https://saltwatercolours.com/testfull/
Thanks!
HI!
pls. add following css:
@media (max-width: 1199px) { .wpb_row > * { margin-top: 0; } }Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list.
Regards, Oliver
Thanks, Gregor. That indeed is the right place in the CSS. I can replicate it by using Inspector in FireFox. See before and after screenshots. However, when I enter the override CSS in the them options as you show below, it does not work. it is not overriding the default CSS.
Looks like we have it! Thank you, Jesus! and Gregor!
See attached!