Drop down menu & position absolute sizing

Hey, I’ve never really looked too in depth into dropdown menus and decided it’s time haha, what’s an efficient way to “dock” them so they don’t sit off screen when the screen gets too small like in this example codepen?

I saw the recent video Kevin made on it however due to the lack of browser support in things like anchor-positioning, I was wondering about more general approaches.

Following that, I’ve never really noticed that position absolute makes elements min-content or if not something similar, what is it that shrinks a position absolute element and how do you effectively expand them back to an intrinsic size without setting a width/min width which presents overflow issues in some cases?

https://codepen.io/deerCabin/pen/ogvbVKJ

Thanks in advance
Was this page helpful?