Docs

[kkarc]

Hi,

I have a full screen slider revolution above masthead in the front page and a full screen essential grid beneath it.

A div is blocking the upper part of the essential grid.

How can this be fixed?

I tried to change the Z-index of the div but it didn’t work.

Knafo Klimor Architects

[Rupok]

Hi there,

Thanks for writing in! You can add this under Custom > CSS in the Customizer.

.x-main.full {
    position: relative;
    z-index: 99999;
}

Hope this helps.

Cheers!

[kkarc]

It didn’t work /:
the first row of images in the grid is still not totaly “hoverable”

[kkarc]

here’s a screenshot

[Lely]

Hi There,

The screenshot didn’t upload because it’s file size is more than 512KB.
Then I look on your site again and saw the issue.
It is because of the following custom CSS on Homepage > Cornerstone > Settings Tab > Custom CSS:

@media only screen and (min-width:980px){
   div.x-slider-container.above{
 z-index:999998 !important;
}
}

Please remove it.
See this:http://screencast-o-matic.com/watch/cbe1Q26upj

Hope this helps.

[kkarc]

I added this rule in order to have a full screen revolution slider above my menu on the left.
is there a way to get a full screen slider without creating the problem with the grid?

[Lely]

Hi There,

In that case we need to put the grid on top of that slider. To do this add z-index: 9999999; position:relative; on the style field of the section where the grid is located.

Cheers!

[kkarc]

It worked great!! Thank you!! (:

I have one more question about the grid:

I would like the grid to be full screen (height an width) excluding the area of the menu on the left.
when I change the essential grid settings to “full screen” it overlooked the menuon the left – so I leave this setting as “boxed”.
Is there a way to make the grid full screen?
Or make the “box” (the div it situated in) to be full screen?

[Lely]

You’re welcome!

With what you’re trying to achieve, this means that you want the menu out on your homepage, correct? Making the grid fullwidth will do just that. If that is a yes, then choose fullwidth template and then on Superfly Menu > General Display Rules > Hide on checked pages: Choose Homepage

[kkarc]

I am sorry, but I wasn’t clear.

I’m satisfied with the current situation (full screen revolution slider, and beneath it a menu and grid aside).

The only thing I want to change is the behavior of the essential grid: I want it to be responsive and fill the whole area in the screen that is left after the menu took the left side.

On this page I want the same thing (without the revolution slider):

Projects

[Christopher]

Hi there,

Please change number of grids per row for different devices under essential grid settings/grid settings/columns.

Hope it helps.

[kkarc]

the width is not the problem… other ideas?

[Joao]

Hi There,

Would you mind to provide a screenshot so we can better understand the issue_

Thanks

[kkarc]

I would like the thumbnails to fill the screen and keep the menu

[Christopher]

Hi there,

I’m sorry but the only way to increase the height is to reduce number of grids per row on smaller screens.

Hope it helps.

[Author]

Posts