0

The setup, simplified

I realized that my question from earlier was inaccurate. I decided to reproduce my problem to ensure I'm describing the situation as well as possible:

https://jsfiddle.net/wheresmycookie/gjd12pyz/49/

.hint__horizontal is a relatively positioned green line that is 1px high and contains an absolute-positioned anchor inside of it.

.container__section is a block for text that is relatively positioned. It's directly beneath hint-horizontal.

The problem

.container__section seems to be position on top of the menu. In the link above, the section is highlighted gray. Notice that you can't click on the menu until it passes .container_section.

Question

It seems like, because .hint__horizontal was rendered before .container__section, all of the absolutely-positioned children are rendered underneath .container__section. What would be the best way to ensure that the menus are always positioned on top?

wheresmycookie
  • 683
  • 3
  • 16
  • 39

0 Answers0