Today, among other things, I needed to render a scrolling div element such that the scrollbar was at the bottom of the element.

I found a nice pure CSS solution from Stack Overflow, albeit one that needed a crucial assist from the comments section:

max-height: 470px;
overflow: auto;
display: flex;
flex-direction: column-reverse;

flex-direction: column-reverse was the find.

However, upon re-rendering the element (say, upon navigating away from and back to the route), the scroll bar would stay where the user had last left it, whereas I wanted return the scroll bar to the bottom. The component needed to be completely unmounted. That’s when …

Similar Posts

Loading similar posts...

Keyboard Shortcuts

Navigation
Next / previous item
j/k
Open post
oorEnter
Preview post
v
Post Actions
Love post
a
Like post
l
Dislike post
d
Undo reaction
u
Recommendations
Add interest / feed
Enter
Not interested
x
Go to
Home
gh
Interests
gi
Feeds
gf
Likes
gl
History
gy
Changelog
gc
Settings
gs
Browse
gb
Search
/
General
Show this help
?
Submit feedback
!
Close modal / unfocus
Esc

Press ? anytime to show this help