How do I make hover not interrupt the flow of the others

Hello,
I have two questions How do I make an element absolute to its parent that is also absolute to another element? How do I make an after element not interrupt the flow of the others?

For example, here’s my code. —>

https://codepen.io/VeljkoCukic/pen/rNOXgyW

I want to add a borderline at the bottom of the pink square and when it appears, I want it to not move the text out of its place when it appears
Thanks in advance!

If you set the ::after pseudo-element to be position: absolute it will not interact with the text inside the box. If you want it at the bottom you can set bottom: 0 on it.

Not sure I fully understand your first question.

1 Like