[pinheadncParticipant]

I have a revolution slider that i want to LIMIT to 1600px wide by 400px tall so all of the content stays above the fold.
I searched the forum for this answer and found the CSS entry below. This works in WIDE screen mode but as I scale down the screen size the GAP above and below the slide grows. These two images show what i am talking about.

CSS added that does reduce the GAP in WIDE screen mode, but in narrow, like a cell phone, I get a huge gap above and below

/* Code below limits Revolution Slider to 400px tall */

.rev_slider .tp-bgimg.defaultimg {
background-position: center center !important;
max-height: 400px;
}

.rev_slider_wrapper, .rev_slider, .tp-fullwidth-forcer, .rev_slider .tp-bgimg.defaultimg {
max-height: 400px !important;

}

I want the slide to tuck at the bottom of the header and the next section to be just below no matter what screen format I use.

Thanks for any help you provide.

[JadeModerator]

Hi there,

Kindly provide us with your URL so that we could check the page.

Thank you.

[pinheadncParticipant]

http://prosourcewaste.com/

[JoaoModerator]

Hi There,

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Thanks

Joao

[pinheadncParticipant]

This reply has been marked as private.

[pinheadncParticipant]

I have fixed PART of the problem by setting the slider size to 1600x400px. But the same gaps appear above and below as I move to smaller screen sizes.

[FriechModerator]

Hi There,

Keep the slider responsive, and add this inline-style on the STYLE field of the Section instead.

max-height: 400px;overflow-y: hidden;

Hope it helps, Cheers!

[pinheadncParticipant]

I added the inline-style as you said. No change. Still has the same behavior.

Also, when you said “keep the slider responsive” I’m not sure what that meant. Could you elaborate. I’m not sure if I am missing something.

[FriechModerator]

Hi There,

Sorry for the confusion, what I mean is do not apply a static width/height (1600x400px) on your slider and remove any custom CSS you applied into it. Keep the slider responsive adopting the size of the column and lets apply the limitation on the column where the slider is instead.

Forget the given inline css for now and make the slider back to its default behaviour. And please provide us a little more clarify on what you want the slider to look like on desktop and mobile. A screenshot would be appreciated.

Thanks.

[Author]

Posts