[Resolved] Cell does not stick

[Author]

Posts

[samuelel]

Hi,
I am editing a Layout for a custom post type. The layout contains several cells. I would like to make a tab cell sticky, so that it stays in the same position while scrolling. The tab cell is has Class: tab_class_1.

Adding the following CSS code (Layout CSS and JS Editor) does not result in a sticky tab (i.e. the tab scrolls with the rest of the page):

.tab_class_1 {
  position: sticky;
  top: 0;
} 

How can I fix this?

[Christian Cox]

The position:sticky CSS style requires an ancestor element with position:relative. Can you tell me if any ancestor elements of this cell use position:relative? If not, you must add one. I will need to see this in a browser to make CSS recommendations.

[samuelel]

Hi Christian,

Here it is: hidden link. The website is running on my PC.

Do you have any suggestions?

Thanks,
Samuele

[samuelel]

Hi Christian,

This fixes the problem

.tab_class_1 {
    position: sticky;
    top: 0px;
 }

It works once you add 'top: 0px' (or whatever appropriate value).