search

rachelandrew / cssgrid-ama

Ask me anything about CSS Grid Layout
328 stars 12 forks source link

Position: sticky? #42

Closed colinhowells closed 7 years ago

colinhowells commented 7 years ago

Curious about support for this as in my testing it looks as if sticky is ignored if the element is wrapped in a container with grid applied, or happens to be in a grid-area. Here's a JSBin of an example.

In some ways this makes sense – since if the element's in a grid, you'd expect it to actually be in one of its rows and not leap out of it, but this bug makes me wonder if in some testing scenarios sticky does indeed work.

It may also be that since I've spent a grand total of six hours so far learning Grid I may just be doing something wrong ;) The way I'm dealing with this now is not enclosing any fixed or sticky items in a grid container.

snookca commented 7 years ago

In taking a look at your JSbin, it looks like you didn't specify a top value for your sticky header. When I do so, it seems to work. (Also, you need to use -webkit-sticky for Safari.)