Ocultar detalhes vai terminar no final dos detalhes ocultos automaticamente

Isso acontece por causa do ancoramento de rolagem no Chrome e Firefox (em breve no Safari). Esse recurso faz com que os navegadores se ‘ancorem’ a um elemento visível, para que a inserção de conteúdo acima da janela de visualização não cause uma mudança na posição de rolagem.

O Firefox tem um modo de depuração para esse recurso, que pode ser ativado visitando about:config e alternando layout.css.scroll-anchoring.highlight. Então, sim, podemos ver que normalmente ele se ancora a algo no fluxo de posts:

Mas se você rolar muito para baixo quando a linha do tempo estiver colapsada, a linha do tempo será escolhida como ponto de ancoragem:

Como @don diz, isso ocorre porque a ordem dos elementos no DOM é diferente da ordem exibida. Parece que o algoritmo de ancoramento de rolagem percorre o DOM em ordem e escolhe o primeiro elemento totalmente visível que consegue encontrar. Portanto, se a linha do tempo colapsada estiver visível, ela sempre será escolhida antes do conteúdo do post.

Mudar a ordem ajudaria, mas eu estaria preocupado com possíveis regressões. Além disso, me pergunto se é nessa ordem por algum motivo (leitores de tela, talvez?)

A correção mais fácil aqui é definir overflow-anchor: none na linha do tempo. Assim, ela nunca será escolhida para ancoragem:

8 curtidas