Docs

[CogniSens]

Hello,

I would like our homepage’s top image to be full screen on any device.
Please see our current homepage: NuTrain.io

I found a way to make the screen and it is with using

@media screen and (min-width: 481px) {
    #home-top-slider {
    padding: 31vh 1em!important;
    }
}

Is there a simpler or more accurate way to achieve this with CSS only?
Adding height:100% to the section’s ID doesn’t work.

I would like to achieve this without using Revolution Slider if possible.

Thank you!

[Christopher]

Hi there,

Please add full screen revslider below masthead. Add .masthead in slider’s containers field.

Hope it helps.

[CogniSens]

As I stated above, I would like to achieve this without using the revslider plugin.
In some themes this option comes standard.

Thank you

[Rupok]

Hi there,

Please take off the code and use this instead :

#home-top-slider {
  height: calc(100vh - 70px);
  padding: 30vh 1em 0 !important;
}

Hope this will do the job.

[CogniSens]

Hey @Rupok,

Thanks a lot. This works like a charm.
Do you know if this will be compatible with most browsers?

Cheers

[Joao]

Hi THere,

Yes it should be.

Let us know if you need further help,

Joao

[Author]

Posts