Continuation topic: understanding positioning and parent?

[CranberryJuice]

This is a continuation from https://css-tricks.com/forums/topic/how-to-set-menu-text-properly-against-menu/#post-250045

I wanted to better understand how I could have figured out what thing is the parent in this case. Or perhaps, why the parent wouldn’t have been another step lower?

[Shikkediel]

Absolute positioning applies to the first parent in line that has positioning other than static (which is the value any element also gets by default).

[CranberryJuice]

Hi! Better question is why wouldn’t nav ul li not be a candidate, and why would nav ul li a also not work?

[Shikkediel]

If you give either of these relative positioning, they will effectively be candidates. But it doesn’t really match the layout and desired effect well. Maybe I’m not exactly understanding the question though.

[CranberryJuice]

Hopefully a better question: Whats the difference in effect if relative positioning was applied to nav versus nav ul? What’s the difference in effect if relative positioning was applied to nav ul li versus nav ul li a?

[Shikkediel]

The size and position of the relatively positioned parent element is the only difference because the hover effect will place the hidden element to the outer right of it. One could make the layout in such a way that there would really be no directly visible difference.

[Author]

Posts